1

我想弄清楚在主干中使用模型和视图的正确方法。如果可能，应该首先使用什么以及为什么。

例如：如果我有一个应用程序在页面上显示一系列不同的图像，一旦单击它就会移动页面，该页面仅显示带有名称、描述、颜色等的图像。

什么是更好的使用方法；

  1. 单击图像并更改触发路由器的 URL，从而显示正确的视图。从该视图加载模型。

  2. 将点击事件附加到每个图像，这会更改模型中的细节，然后触发事件以更改视图。

  3. 再次使用路由器，调用模型然后触发视图。但是，我仍然可以使用该模型获取详细信息。

  4. 在路由器中调用它们并将模型传递给视图？这又是怎么做到的？

  5. 不同的方法

我正在使用主干样板，我认为这可能会让我有点困惑。但是任何文章或解释都会非常有帮助。

4

2 回答 2

2

我通常设置的方式是大量使用Backbone.Events；我倾向于通过将这些事件绑定到视图中的方法来拦截视图中的点击事件。反过来，该绑定事件将执行一些特定于视图的工作，然后将执行类似的操作this.trigger("Router_SomeEvent")- 指定该事件的绑定，通常是在路由器中创建视图的位置，如下所示：

// Begin router snippet...
someRouteMethod: function() {
   this.views.SomeViewInstance = new MyViews.SomeViewClass();
   this.views.SomeViewInstance.bind("Router_SomeEvent", this.onSomeEvent);
},

onSomeEvent: function() {
   this.navigate("NewLocation", { trigger: true });
}
// End router snippet

使用这种发布/订阅 (pub/sub)模式，您的代码变得更加解耦，并且更易于处理和扩展。一开始有点混乱，但是一旦你掌握了它，就会越来越清楚它为什么有用。我倾向于让我的路由器处理所有......好吧......路由，而我的视图只包含渲染逻辑、事件绑定到 UI 以及必要时将事件冒泡到路由器。您还可以将事件绑定到您的模型；我倾向于使用与视图类似的模型，因为它们会通知我的路由器一些更改，并且路由器将继续通过更改视图状态、更改其他模型或集合等来处理该事件。

Backbone 非常强大，但是需要相当长的时间来学习。我推荐 Addy Osmani 的Backbone Fundamentals；他还有一本关于 O'Reilly 的书，非常值得一读。

于 2012-07-10T17:37:39.410 回答
0

单击图像并更改触发路由器的 URL，从而显示正确的视图。从该视图加载模型。

您不一定需要路由器。例如，如果您打算将此 URL 用作永久链接，并且一旦用户转到此链接就打开图像详细信息视图，您只想使用它。

将点击事件附加到每个图像，这会更改模型中的细节，然后触发事件以更改视图。

为什么要在点击时更改模型？据我了解，您有 3 个视图：包含图像缩略图的容器、缩略图图像视图和图像详细信息视图（例如，在灯箱中打开更大的图像）。现在，当您构建容器时，您将带有图像的集合作为参数传递。Container 为集合中的每个项目呈现缩略图视图。请记住，现在每个拇指视图都有图像模型。现在单击调用图像详细信息视图并传递您已经作为参数的模型。此时实际上不涉及模型更改、路由或事件。

于 2012-07-10T17:45:43.030 回答