Backbone.js 主从场景 [英] Backbone.js Master-Detail scenario

问题描述

我在backbone.js 中实现了一个经典的主从场景.

I have a classic master-detail scenario that I am implementing in backbone.js.

目前我不关心backbone.js 的历史和导航部分，所以我跳过它.

For the moment I am not concerned with the history and navigation part of backbone.js so I am skipping it.

• 我有一个 GridView，其中所有模型都是从休息服务中获取和显示的.
• 我有一个 DetailView(模态窗口)，其中显示了从网格中选择的特定模型，并在主网格视图中显示了更多字段.

我已实施:

• 一个主应用程序，其中附加了所有主干视图和路由器.
• 应用程序在加载文档时初始化
• 一个主要的骨干路由器(更像是一个经典的控制器")，负责:
  • 创建和销毁视图
  • 获取和发布数据
  • 将数据传递给视图
  • 协调视图事件

  现在gridView(Backbone集合)的rest服务返回的数据只是模型的部分数据.

  Now the data returned from the rest service for the gridView (Backbone collection) is only some partial data of the models.

  因此，要显示特定模型的完整详细信息，我必须再次从其余服务中获取详细信息.

  So to display the full details of a particular model I have to fetch the details again from the rest service.

  从模型中获取最终会导致模型与集合断开连接，并且它的任何更新都不会反映在集合本身上，我必须再次刷新主视图以获取所有数据.

  Fetching from the model end up with a model disconnected from the collection and any update on it isn't reflected on the collection itself and I have to refresh again the master view fetching all the data.

  销毁并重新创建详细信息视图有时会使视图事件丢失.

  Destroying and recreating the details view sometimes make it loose the view events.

  这个场景的正确实现是什么?我并不完全理解在主干中做事的最佳方式.

  What would be the correct implementation of this scenario? I am not fully understanding the best way of doing things in backbone.

  推荐答案

  首先，我建议在您的gridView"集合查询中返回模型的完整详细信息.这解决了断开连接的集合"问题.

  First, I would suggest returning the full detail for the models in your "gridView" collection query. This solves the 'disconnected collection' issue.

  虽然，你不必做完整的集合加载——假设为整个集合做一个完整的加载是行不通的——细节太大了，例如，你应该能够通过相同的模型从集合到您的详细信息视图，测试它是部分加载还是完全加载，并为模型发出fetch()"，返回完整数据 - 因为这与集合中的模型相同，应该更新了.有意义吗?

  Although, you don't have to do the full collection load - let's say doing a full load for the entire collection is not going to work - the details are too huge, for instance, you should be able to pass the same model from the collection into your detail view, test to see if its a partial load or a full load, and issue a "fetch()" for the model, returning the full data - being that this is the same model as in the collection, it should be updated. Does that make sense?

  此外，对于细节视图，我建议，特别是如果您的设计只调用一个活动的细节视图，请重用该视图并在视图中编写一个允许您换出模型的函数.

  Also, for the detail views, I would suggest, especially if you're design only calls for one detail view active, to reuse the view and write a function in the view that allows you to swap out the model.

  所以，总结一下:

  • 在应用程序启动时，加载一个 gridView 和一个 detailView.
  • 重构您的 detailView 以允许在其上设置模型.(detailView.setModel(..)
  • 当用户想要查看模型的详细信息时，使用上述函数将该模型传递到 detailView.
  • 如果模型未完全加载，您的 setModel 方法可以去 fetch() 其余数据.您可以测试仅在满载时才会出现的特定属性，也可以在模型上设置一个属性以指示其是否已满载.
  • 如果您发现自己丢失了事件，请尝试在 render() 函数的末尾调用 delegateEvents()，它会重新绑定事件.
  • 由于在 gridView 集合和 detailView 中使用相同的模型，假设您正确响应更改事件，一切都应该同步.

  这篇关于Backbone.js 主从场景的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！