对 Backbone + React 应用程序中的模型的困惑

Posted 2023-02-22

【中文标题】对 Backbone + React 应用程序中的模型的困惑

【英文标题】：Confusion about Models in Backbone + React application

【发布时间】：2015-09-29 10:27:39

【问题描述】：

这是一个使用 Backbone 和 React 的 example。

他定义了一个Model：var _todos = new Backbone.Model();

然后给它添加两个函数：

var TodoStore = _.extend(_todos, 
  areAllComplete: function() 
    return _.every(_todos.keys(), function(id)
      return _todos.get(id).complete;
    );
  ,
  getAll: function() 
    return _todos.toJSON();
  
);

我不明白为什么areAllComplete 被应用于Model 而不是Collection。

这不应该是 Collection 中的一个函数，它将获取其所有模型并检查 complete 属性。

同样，我希望 getAll 属于 Collection - 获取它的所有模型。

此示例似乎将Collection 替换为Model。

也许我不完全了解模型是如何使用的。

【问题讨论】：

我不明白你为什么要混合 Backbone 和 Flux。

Re:model v 集合，这取决于您如何将它们存储在服务器上。这里看起来模型实际上是一个待办事项的列表，每个项目只是作为该模型上的一个属性被键入。整件事对我来说似乎很愚蠢。

@Mathletics 是否有理由不将两者一起使用？ React 只是“MVC 中的 V”，对吧？我想使用 Backbone 进行路由和存储。我一直在考虑这个approach。

我的回应是考虑到 React。这是你的意思吗？或者我为什么要特别使用带有 Backbone 的 Flux 架构？

我是认真的；我不明白将 Flux 与 Backbone 混合使用。 Backbone 已经处理数据存储和事件。 （尽管我承认我并不精通 Flux。）

【参考方案1】：

在我看来，该示例以一种相当奇怪的方式使用 Backbone.Model。

This 是它向商店添加新待办事项的地方：

var id = Date.now();
  _todos.set(id, 
    id: id,
    complete: false,
    text: text
  );

它的基本作用是将每个待办事项设置为Model 的属性，使用id 作为属性名称。它以_todos.attributes 结束，如下所示

  "1436600629317": 
    "id": 1436600629317,
    "complete": false,
    "text": "foo"
  ,
  "1436600629706": 
    "id": 1436600629706,
    "complete": false,
    "text": "bar"
  

这与您从 _todos.toJSON() 获得的输出相同。我不知道他们为什么决定这样实现它，如果他们尝试使用 Backbone.Sync，他们最终会得到一个不完全 RESTful 的服务器 API。在不利用 Backbone 提供的任何东西的情况下使用 Backbone 似乎很奇怪。有对change 事件here 的引用，但我没有看到它在任何地方使用。您可以使用任何常规 JS 对象轻松地重新实现该存储。

该示例似乎在 Backbone 中实际使用的唯一内容是调度程序中的 Backbone.Events。您完全正确，使用 Collection 会更有意义，因为这样您实际上可以使其与基于 REST 的服务器 API 对话。该示例似乎只是为了使用 Backbone 而使用 Backbone。