主干模型更改和视图渲染更新答案

【问题标题】：Backbone model change and view render update主干模型更改和视图渲染更新
【发布时间】：2014-09-18 23:33:51
【问题描述】：

我在后端有一个带有会话的 express 应用程序，在前面我有 Backbone+RequireJS。我的问题在于我拥有的会话模型，以及触发视图渲染方法的更改事件。

所以：

该应用有一个 Home 视图，它有一个 Session Model 的“change”事件的侦听器，并运行“render”方法。
没有凭据的用户从主页进入公共页面，比如 /about
在那里，用户从具有登录表单（用户/密码）的标题登录。
由于第 1 项中的侦听器，容器元素会使用新的主页内容进行更新，但用户仍在 /about 中。

所以，问题是：如何避免这种不良行为，以便视图仅在正确的路由处于活动状态时才监听事件？

代码示例：

"use strict";

var SessionModel = Backbone.Model.extend({});

var sessionModel = new SessionModel();

var HomeView = Backbone.View.extend({
    initialize: function() {
        this.listenTo(sessionModel, "change", this.render);
    },
    render: function() {
        // updates the main container element
    }
});

var AppRouter = Backbone.Router.extend({
    "": "home",
    "about": "about"
});

var appRouter = new AppRouter();

appRouter.on("route", function() {
    sessionModel.fetch(); // Updates session model on every route change
});

appRouter.on("route:home", function() {
    var homeView = new HomeView();
    homeView.render();
});

【问题讨论】：

/about 上的用户但HomeView 上的用户真的不存在吗？通常，当从 / 切换到 /about 时，您会破坏旧视图并抛出新视图。
您能解释一下为什么您需要在特定视图中听取sessionModel 的更改吗？它不应该在Routerinitialize函数中吗？
我会尝试destroy解决方案，因为我需要sessionModel随时存在。

标签： javascript node.js backbone.js express requirejs

【解决方案1】：

你可以监听一个特定的属性，而不是监听每一种变化。

this.bind("change:SomeExpecificThing", doEspecificThing)

【讨论】：

以现在的结构，变化还是触发了HomeView的“render”方法，替换了主容器的内容。问题不在于属性发生变化，而在于事件侦听器。

【解决方案2】：

我找到了解决问题的方法：

sessionModel.on("change", function () {
    Backbone.history.loadUrl();
}).fetch();

这样，我们触发了正确的路由并再次渲染，而无需向视图添加侦听器。

【讨论】：