3

我试图尽可能地延迟加载，

但是，我对如何开始感到困惑，这是我的“顺序理解”：

目标：创建一个联系人页面，其中包含服务器上现有的联系人

  • Step1.0：要使用路由器：<div id="contacts">必须存在才能触发规则，所以我退回到（Step0.9），
  • Step0.9：在body中创建了这个div。好吧，路由器找到#contacts，呵呵，不过这是个视图，ok，后退一步（Step0.8）。
  • Step0.8：擦除在 中创建的 divbody并用视图替换它：
contactsView = Backbone.View.extend 
tagName: 'div',
id: 'contacts'

为了延迟加载，这个视图应该只在我的路由表中触发 #contact 时创建，但我只是从正文中删除它，它确实存在，我回到 Step1.0 ？？？

找到了一些教程，显示了全局变量设置......请，使用路由器、视图、它们的模型和集合的一般场景应该如何进行（答案不需要代码，每个步骤只需一行）？

我知道可以有多种方法，但是创建元素的最常见的主干步骤策略是什么。

提前致谢。

4

2 回答 2

1

我通常的做法是

  • 有div#contacts负载在体内
  • 路由器将 映射到路由器#contacts中的方法showContacts

  • showContacts 创建视图，将其附加到所需的 div

    var view = new contactsView();

    $('#contacts').empty().append(view.el);

    view.render();

  • 您无需在定义中定义 idcontactsView

于 2013-01-29T18:00:34.280 回答
1

我不是 100% 确定我理解正确。如果我没有，请在评论中告诉我。

您关于一般用法的问题似乎有些混淆Backbone.Router。当路由器将路由映射到 URL 片段#contacts时，这与具有 id 的 DOM 元素无关#contacts。井号恰好是 URL 片段和 idCSS 选择器的标识符，但这就是相似性结束的地方。

通常我的路由器看起来像这样：

var AppRouter = Backbone.Router.extend({
  routes: {
    contacts: "contactList"
  },
  contactList: function() {
    var contacts = new ContactCollection();
    var view = new ContactListView({collection:contacts});
    view.render().$el.appendTo("#contacts");
  }
});

请注意，#contacts不需要将元素称为那个。您可以调用它#pony，也可以根据需要将视图直接渲染到文档中body。

因此，在这些方面，工作流程是：

  1. 路由器被击中
  2. 集合已初始化
  3. 视图被渲染
于 2013-01-29T18:25:15.233 回答