如何刷新Backbone.js页面变化的异步视图？

我有一个应用程序只在$（document）.ready中加载数据一次。集合视图和模型视图之间有链接。视图具有异步体系结构，因此它们在页面刷新上呈现。但是当我点击这些链接时，什么都没有呈现，因为数据已经被抓取并且没有事件被触发。是否有插件或窍门可以处理这两种情况？如何刷新Backbone.js页面变化的异步视图？

Backbone.Collection.prototype.lazyLoad = function (id) { 
    var model = this.get(id); 
    if (model === undefined) { 
     model = new this.model({ id: id }); 
     this.add(model); 
     model.fetch(); 
    } 
    return model; 
} 

var Col = Backbone.Collection.extend({ 
    model: Model, 
}); 

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

var ColView = Backbone.View.extend({ 
    ... 
    initialize: function() { 
     this.collection.on('reset', this.render); 
    } 
}); 

var ModelView = Backbone.View.extend({ 
    ... 
    initialize: function() { 
     this.model.on('change', this.render); 
    } 
}); 

var AppRouter = Backbone.Router.extend({ 
    routes: { 
     "": "colView", 
     "col/:id": "modelView" 
    }, 

    colView: function() { 
     new ColView(collection: col); 
    } 

    modelView: function (id) { 
     new modelView(model: col.lazyLoad('modelId')); 
    } 
}); 

$(document).ready(function() { 
    col = new Col; 
    col.fetch(); 
    app = new AppRouter(); 
});

来源

2012-06-20 chessman

我们需要在这里看到更多的代码。你有链接定义的事件处理程序吗？链接有什么作用？你期待他们做什么？ – tkone

收集视图有每个模型的链接。链接由AppRouter管理，即当我点击'col/modelId'链接时，modelView被创建。但是这个视图只在模型发送“更改”事件时呈现。它不会发生，因为所有数据都提前获取。 – chessman

我期望遵循下面的行为：if（page'col/modelId'被刷新）{在数据被提取时渲染'change'事件的模型} else {立即渲染模型} – chessman

据我所知，您希望它渲染和显示视图，但由于col已经取出这不会触发，你必然要ModelView's渲染事件change事件。那么你总是可以自己调用ModelView的渲染。

modelView: function (id) { 
    var view = new modelView({ model: col.lazyLoad('modelId') }); 
    view.render(); 
}

来源

2012-06-20 14:08:33

当用户刷新页面时，这不起作用。当调用view.render（）时，尚未提取模型。 – chessman

@ user1469049：然后修复你的'渲染器'逻辑来做一些合理的事情（比如渲染一个空模板或一个微调器），如果模型还没有出现，然后让适当的事件触发另一个'render'调用。 –

如何刷新Backbone.js页面变化的异步视图？

回答

相关问题