Question

我试图整理Backbone项目中的代码。我面临的一个问题是我在渲染的初始化函数中初始化了我的所有视图。我现在决定一次只初始化一个视图（和它的孩子）。

页面的渲染工作，我可以在视图之间前后交换。在硬刷新页面后触发视图中的事件（F5等）但是一旦我移动到另一个视图，事件就不再触发了。我不明白为什么因为先前的观点应该在第二次初始化时完全删除。然后我们应该得到一个干净的渲染，就像刷新后第一次加载一样。任何人都可以解释为什么这些事件都没有解决？

以下是演示此问题的代码示例：

newView: function(view){
            //Check if the holding variable is defined. If it is then  
            //call the close function
            if (routerView == undefined){
                console.log("routerview is undefined")
            } else {
                // This calls a function on the view which will remove any
                //children, once it's done that it will remove its self.
                routerView.close();
            }

            // When removing the view it removes the parent element in the index file.
            // Here we add the container back in and set it to the new view's el
            if ( $('#AppContainer').length == 0 ){
                // Add new div container to the app and assign it to the 'el'
                view.el = $('body').prepend('<div id="AppContainer"></div>');                   
            }
            // Return view to the route for rendering.      
            return routerView;
        },

其中一个视图中的close函数看起来像这样：

close: function(){
    //Deal with any child views here as well.
    this.remove();
},

最后，在我们调用newView函数的路径中看起来

admin: function(){
    // Call the newView function with a new instance of the AdminView and then assign it back        
    this.adminView = router.newView( new AdminView({ el : $("#AppContainer")} ));
    //Render the view
    this.adminView.render();

},

Answer 1

我已经做了一些调查问题的工作，我发现了它。问题是两次，但出现在同一行代码上。

view.el = $('body').prepend('<div id="AppContainer"></div>');

我在主干docs上发现你应该使用setElement函数来改变视图的元素。然后，它会传输所有绑定事件，这些事件现在意味着它们可以工作。

然后我发现$('body').prepend('<div id="AppContainer"></div>')将返回对body的引用而不是新的#AppContainer，但它实际上返回对body的引用，这意味着视图的内容被放置在body中。

重新初始化主干视图后未触发事件

1 个答案: