1

我是新来的backbone.js，并试图弄清楚，我目前有以下对象：
TodoItem 模型
TodoItemView 视图
TodoCollection 集合

我将一堆 TodoItems 添加到 TodoCollection，它为每个创建 TodoItemViews，这会呈现一个基本的 todo 项目列表。现在，当我单击一个待办事项时，我想打开一个新选项卡，其中包含该待办事项的所有数据，形式为（即可编辑）和一个保存按钮。

我试图弄清楚如何对此建模.. TodoItemView 是否应该有一个点击事件：

  1. 打开一个选项卡并填写所有信息并以某种方式将该新选项卡中的事件绑定到其中的功能？（几乎肯定是错的）
  2. 创建一个新的 EditableTodoItemView，其渲染会打开一个新选项卡，单击 TodoItemView 创建一个新的 EditableTodoItemView 然后忘记它（我认为更好）

我假设 EditableTodoItemView 应该引用原始模型，即 TodoItem 应该在 EditableTodoItemView 和 TodoItemView 之间共享。不需要创建新的集合，当用户点击保存时，EditableTodoItemView 调用backbone.sync()。

同样，我假设当我创建一个新的 TodoItem 时，我将它推送到 TodoCollection，它会为其创建一个 TodoItemView，并且如果项目是新的（即具有默认数据），可能会自动创建一个 EditableTodoItemView。

这有意义吗？还有什么我应该考虑的吗？

4

1 回答 1

0

在多个视图之间切换的最简单方法是Backbone.Router. 你可以像这样使用它：

var TodoRouter = Backbone.Router.extend({
  routes: {
    "edit/:id":  "edit",   // matches http://yourapp.com/#edit/1234
    ".*":        "index",  // matches http://yourapp.com/#everything-else
  },

  edit: function(id) {
    item = TodoCollection.get(id);
    this.view = EditableTodoItemView({model: item});
    $("#main").html(this.view.render().el);
  },

  index: function() {
    //...
  }

});

然后window.router = new TodoRouter; Backbone.history.start();在启动应用程序的地方运行。在运行此之前，请确保您的 TodoCollection 已获取。您可以使用 TodoCollection.bind("reset", _.once(function(){Backbone.history.start()}));.

于 2012-02-06T19:26:16.750 回答