Backbone.js Web 应用程序 - 状态、历史和数据管理答案

【问题标题】：Backbone.js web app - state, history & data managementBackbone.js Web 应用程序 - 状态、历史和数据管理
【发布时间】：2011-10-18 08:22:33
【问题描述】：

我正在尝试构建类似于下图所示的东西。

状态和历史管理
我希望能够随时在应用程序中序列化当前状态，最好能够对这些参数进行版本控制。
1) 首先，什么是覆盖 defaultState 参数的好方法哈希中给出的任何有效参数？

defaultState = {
    mode : "2up", //Defines layout and how many widgets to init
    models : [{year: 1980, selected: "SE"}, 
              {year: 2010, selected: "NO"}] //Widget models
}

var AppRouter = Backbone.Router.extend({                            
routes: {
    '': 'hashChangeHandler',
    'v1?:params': 'hashChangeHandlerV1'
},

hashChangeHandlerV1: function(params) {
    //here do something to override defaultState with params on init
    //set models and layout etc.
}
});

//Handle history entries separately??
collection.bind("change", updateHistory)

function updateHistory () {
    //each model toJSON(), then jQuery.param.querystring etc.  
    appRouter.navigate('v1' + state, false);
}

2) 上述方法是否是一种有效的版本控制方式？（如果状态参数/API 发生变化，则为 v1 路由提供一个特定的处理程序，为 v2 提供另一个处理程序?) 如果您能举例说明适用于这个小部件化可视化应用程序的状态/历史解决方案，我会非常高兴 :)

3) 我想防止在拖动时间滑块和某些其他事件时设置历史条目。我可以在拖动滑块时删除 collection.change 事件监听器（它跟踪所有实例化的 WidgetModel）吗？或者你有什么建议？

数据管理
在实例化视图之前（以及当它们的模型的选择属性发生更改时）我想确保加载数据（300-400 KB 的数字统计数据）。
4) 什么是在 Backbone 中解决此问题的典型方法？（即延迟 model.trigger 事件直到属性稳定。）

【问题讨论】：

标签： javascript backbone.js state data-visualization browser-history

【解决方案1】：

4 - 等待您的模型加载，然后才实例化视图。

具体来说，您应该有一个人（可能是应用程序视图）来监听您的数据已加载的事件，并创建视图。

如果您的数据加载到模型中，那么在fetch 的success 回调上，您可以触发一个事件，让应用程序的其余部分知道它已加载。

如果您的数据加载到集合中，您可以监听该集合的reset 事件。

【讨论】：

感谢您的回复。具体情况是模型中属性“selectedCountry”的更改应在重绘视图之前获取 300-400 KB 的 CSV 数据。什么是好的方法？
同理。当“选定国家”发生变化时： - 视图拦截它并显示“正在加载”或类似的东西 - 你应该加载你的统计数据（可能是一个统计数据集合），当它们被加载时触发一个事件 - 视图拦截这个事件，隐藏' loading' 并显示数据模型应该加载数据，在 fetch 的成功回调上，您可以触发一个事件，让应用程序的其余部分知道它已加载。