具有部分和完全资源加载的规范化状态

时间:2017-05-27 14:32:19

标签: reactjs redux normalization

我正在试图规范我的状态,并且无法弄清楚如何处理部分&完整的资源,即他们是否应该分享相同的国家片段或者降级到他们自己的片段。

更多信息:

当我发出things列表的请求时,服务器会以部分列表进行响应。

[ { id: 1, name: "thing1"},
  { id: 2, name: "thing2"},
  ...
  { id: N, name: "thingN"} ]

当我请求单个thing时,服务器会使用更完整的对象进行响应。

{ 
  id: 1, 
  name: "thing1",
  img_url: "url1",
  description: "description1",
  ... and more fields
}

部分清单和详细信息都需要同时出现。

那么这些部分和完整的things是否应该处于相同的状态?

如果是,那么管理某个thing部分或完全获取的最佳做法是什么?

感谢您的帮助!

2 个答案:

答案 0 :(得分:0)

获取单个项目的目的是什么?可能会显示出来吗?为什么不设置你的状态:

this.state = {
  allThings: [],
  singleThing: {}
};

并相应填写。

答案 1 :(得分:0)

你可以通过以下几种方式解决这个问题:

  1. 像这样有一个不完整的对象:

    {
      id: 1,
      name: 'thing1',
      detail: null //this would be a JS object when populated
    }
    

    如何使用它:在使用详细视图的组件中,检查状态为null。这意味着如果将来需要多个,您可以延迟加载详细信息,如果需要,也不必再次检索它们。但是,如果需要更新信息(您必须同时解析null和最后检索日期,创建陈旧数据可能会有风险),这并不是很好。

  2. 将两个节点作为完全不同的节点进行管理,其中详细视图是数组或只是单个对象。如果您希望始终更新生命周期事件上的对象(例如,在组件装载上,您始终要刷新数据),则此方法可以更好地工作。

  3. 我的个人偏好是#1 - 我经常使用Firebase,这非常有效,因为实时数据库处理数据应该更新,然后让它们处于状态意味着我可以超级快速地向用户显示数据如果它已预先加载。