我使用backbone.boilerplate来创建一个简单的应用程序。
我想创建可以显示站点集合的模块。每个站点都有 id 和 title 属性(例如 [{ id: 1, title: "github.com"}, { id: 2, title: "facebook.com"}]
。
我的路由器:
routes: {
"": "index",
"sites": "sites"
},
sites: function () {
require(['modules/sites'], function (Sites) {
var layout = new Sites.Views.Layout();
app.layout.setView('#content', layout);
});
}
所以,我的网站模块具有布局,可以执行以下操作:
Sites.Views.Layout = Backbone.Layout.extend({
template: "sites/layout",
className: 'container-fluid',
initialize: function () {
_.bindAll(this);
this.collection = new Sites.Collections.Sites();
this.collection.fetch({
success: this.render
});
},
beforeRender: function () {
var siteList = new Sites.Views.SiteList({
collection: this.collection
});
this.setView('.content', siteList);
},
});
Sites.Views.SiteList = Backbone.View.extend({
template: 'sites/list',
beforeRender: function () {
this.collection.each(function (model) {
var view = new Sites.Views.SiteItem({
model: model
});
this.insertView('tbody', view);
}, this);
}
});
Sites.Views.SiteItem = Backbone.View.extend({
template: 'sites/item',
tagName: 'tr',
serialize: function () {
return {
title: this.model.get('title')
};
}
});
好的。现在我的问题是:当用户单击集合元素时,请帮助我选择呈现一个站点 View 的最佳方式。我希望它像 gmail 一样工作:一个屏幕显示所有字母,而所有屏幕显示一个字母(选择时)。也许您有类似应用程序示例的链接。我正在等待您的建议。
最佳答案
查看您的 Pastebin 代码,您似乎对 Backbone 有了基本的了解,这当然是您入门所需的全部内容。
话虽这么说,您可能会发现这篇文章/教程很有帮助。它逐步介绍了构建互连 View (在本教程中它们与 <select>
元素相关)的过程,这些 View 使用 AJAX 来更新其值:
http://blog.shinetech.com/2011/07/25/cascading-select-boxes-with-backbone-js/
关于javascript - 实现 Backbone 名单应用的最佳方式,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/15618898/