Javascript 缓存主干视图及其事件

我正在开发一个相对较大的应用程序，类似于某种应用程序集合

我所有的应用程序都有一个引导视图，加载基本布局和嵌套视图

现在，我开始对视图实施单例模式：

var SomeView = Backbone.View.extend({});

if (SomeView._instance) return SomeView._instance;

SomeView._instance = new SomeView();

return SomeView._instance;

现在我提到，当我在不同的应用程序（视图）之间切换时，事件系统被破坏。这实际上是非常合乎逻辑的。最后，我们将视图从文档中删除。然而，我对总是建立新观点有某种抗拒。这是非常无效的：所有东西都必须重新加载（数据）并重建

那么，有没有办法将事件重新绑定到缓存的视图，或者这是一个废话，我应该接受视图必须重新生成的说法？

你好，博多

更新：

define(['jquery', 'underscore', 'backbone', 'views/settings/profile'], function($, _, Backbone, ProfileSettingsView) {

    var ContentView = Backbone.View.extend({

        tagName: "div",

        className: "content well",

        initialize: function() {
            this.on('change:section', this.change, this);

            this.views = {};
            this.views.profile = new ProfileSettingsView();
        }, 

        render: function() {
            this.$el.empty();

            return this;
        },

        events: {
            "click": "click"
        },

        // the router triggers this one here
        change: function(query) {
            console.log(query);

            // if I uncomment this then nothing is rendered at all
            //this.$el.detach();

            var el;
            if (query === 'profile') {
                el = this.views.profile.render().el;
            } else {
                this.$el.empty();
            }

            if (el) {
                this.$el.empty().append(el);
            }

        },

        click: function(e) {
            console.log('clicked, content should disapear');
        }

    });

    if (ContentView._instance) return ContentView._instance;

    ContentView._instance = new ContentView();

    return ContentView._instance;

});

对于如何使用jquery的detach（），我有点困惑。 我查看了官方文档中的演示，发现仅仅在jquery对象上调用.detach（）是不够的。detach返回一个新对象，它看起来像jquery one，并且包含绑定的事件。最困难的是，我必须把detach（）的返回保存在某个地方，现在我必须从它的来者那里得到它。现在我没有任何检查。我现在将搜索一些主干。使用detach（）查看示例，但我认为它是特定的

更新2:

define(['jquery', 'underscore', 'backbone', 'views/settings/profile'], function($, _, Backbone, ProfileSettingsView) {

    var ContentView = Backbone.View.extend({

        tagName: "div",

        className: "content well",

        initialize: function() {
            this.on('change:section', this.change, this);

            this.views = {};
            this.views.profile = new ProfileSettingsView();
        }, 

        render: function() {
            this.$el.empty();

            return this;
        },

        events: {
            "click": "click"
        },

        // the router triggers this one here
        change: function(query) {
            console.log(query);

            // if I uncomment this then nothing is rendered at all
            //this.$el.detach();

            var el;
            if (query === 'profile') {
                el = this.views.profile.render().el;
            } else {
                this.$el.empty();
            }

            if (el) {
                this.$el.empty().append(el);
            }

        },

        click: function(e) {
            console.log('clicked, content should disapear');
        }

    });

    if (ContentView._instance) return ContentView._instance;

    ContentView._instance = new ContentView();

    return ContentView._instance;

});

---

对!！我找到了一个解决方法：不保存事件，然后将其重新插入DOM。我们可以调用“this.delegateEvents（）”来重新绑定所有事件。这确实只是一个解决办法，如果有人能给我举个例子，我会很高兴：）

就我个人而言，我更喜欢重建我的观点

---

然而，我知道很多人喜欢重复使用它们。在这种情况下，请按照Tim Branyen的这篇博文中的说明进行操作：

hi，谢谢您的链接。我有两个小问题：1。为空（）.append（）；是否真的推荐over.html（）？2.我应该将$el.detach（）放在我的Backbone.View中的什么位置？