React / Flux - 每次更新/添加/删除后获取所有数据答案

【问题标题】：React / Flux - fetch all data after every update/add/removeReact / Flux - 每次更新/添加/删除后获取所有数据
【发布时间】：2017-02-25 16:10:59
【问题描述】：

我正在学习 React 和 Flux，到目前为止，我看到的所有示例都让我感到困扰。它们几乎都是 CRUD UI。在它们中，它们总是在每次更改后获取所有数据（更新/添加/删除等）假设我们有一个 todo 应用，用户添加了一个新的 todo 项。作为响应，商店将获得一个动作，调用服务器中的一些 API 来添加商品，然后再次获取所有商品。那不是很贵吗？我理解为什么它使事情变得更简单，这很好。但是，为什么不将该项目添加到商店的状态。我知道这样做可以让您始终保持存储和服务器中的数据像这样同步，但它并不昂贵。

我看到的一个解决方案是分页，但在示例中，每次用户更改新页面时，他们仍会获取新页面的所有项目。

为什么总是获取所有数据？
如果我们使用分页 - 我们会在每次用户更改页面时从服务器获取新页面吗？

【问题讨论】：

标签： reactjs flux

【解决方案1】：

不必在每次更改后获取数据。在我构建的应用程序中，我总是更改商店而不是获取所有数据。

仅在一个涉及 DreamFactory API 的项目中，我们曾经在更新后刷新模型（仅该模型/项目）。这是必要的，因为 DreamFactory API 在一次调用中提取所有相关数据。

【讨论】：

您是否会说如果我有很多数据（比如说 1000 多个项目），是否值得使用分页来查询服务器以获取每次更新？因为将所有物品保留在商店中似乎是一个巨大的内存问题。也许这就是为什么他们总是重新加载数据背后的要点。
现代浏览器处理商店中的 10,000 件商品应该不是问题。分页并不总是好的，尤其是对于企业应用程序。像 zippy-ui/react-datagrid 或 ag-grid 这样的数据网格声称它们可以在浏览器上处理多达 50,000 甚至百万行。对于消费者应用程序，分页更有意义。这个想法不是用太多的数据压倒用户。浏览器可以非常轻松地处理 1000 个项目。