在Backbone.js中使用后退按钮后多次触发的事件

dzhpxtsq  于 2022-11-10  发布在  其他
关注(0)|答案(2)|浏览(134)

我正在构建一个Backbone应用程序,我遇到了这个奇怪的问题。在状态A(路线:“”),我有这样的看法:

var view = Backbone.View.extend({
    events : {
         "click a.continue" : "next"
    },

    next : function(e) {
       //Some stuff
       Backbone.history.navigate("/page2");
    }
});

并且一旦我点击了具有“continue”类的锚,我就被重定向到状态B(路由:“/page 2”)。如果我点击浏览器的后退按钮,然后点击锚,调试我注意到 next 函数被触发了两次。实际上,如果我不断地来回移动,事件被触发的次数会不断增加。
有线索吗?

jv4diomz

jv4diomz1#

你周围有僵尸的景象。
其要点是,当示例化并显示第二个视图(“状态B”)时,并不是在处理第一个视图。如果有任何事件绑定到视图的HTML或视图的模型,则需要在关闭表单时清理这些事件。
我写了一个详细的博客文章,在这里:http://lostechies.com/derickbailey/2011/09/15/zombies-run-managing-page-transitions-in-backbone-apps/
一定要阅读评论,因为“约翰尼O”提供了一个替代的实现,我认为这是相当辉煌。

uwopmtnx

uwopmtnx2#

我有同样的问题,解决方案是...

App.Router = Backbone.Router.extend({
    routes: {
        "fn1": "fn1",
        "fn2": "fn2"
    },
    stopZombies: function(objView){
        if(typeof objView === "object"){
            objView.undelegateEvents();
            $(objView.el).empty();
        }
    },
    fn1: function(){

        this.stopZombies(this.lastView);

        var view1 = new App.v1();
        this.lastView = view1;
    },
    fn2: function(){

        this.stopZombies(this.lastView);

        var view2 = new App.v2();
        this.lastView = view2;
    }
});

将最后一个执行视图存储在此.lastView中,然后stopZoombies()从此视图中删除事件。

相关问题