如何编写这个Store结构

How to write this Store structure?

本文关键字:Store 结构 何编写      更新时间:2023-09-26

我正试图找出我的Redux商店处理列表的最佳方式。现在它看起来像这样:

Store = {
    users: [],
    posts: [],
    lists: [],
}

我的问题是这个列表数组。本质上它是一个存储特定资源的分页列表的存储,例如:

lists: [
    {
        id: 'users/43/posts',
        items: [25, 36, 21]
    }
]

由于我使用url作为id,因此显示用户帖子列表的组件将确切地知道要显示哪个列表。现在有人告诉我,这是一个非常非常糟糕的主意。我只是想听听你的建议,怎样才能更好。另一个建议的方法是:

users: [{
    id: 2,
    posts: [
       {
           url: 'users/2/posts',
           items: [13, 52, 26],
       }
    ]
}]

所以我不明白的是,Redux怎么知道在哪里保存这个列表?我需要在action参数中指定保存位置吗?

谢谢你的建议。

从技术上讲,只要你让它工作,任何事情都可以工作!不过,第二种方法看起来更为成熟。您不希望使用url作为ID。id应该是数字或特殊的字符+数字序列。当你的应用程序增长时,你会想要规范化你的数据,即将ID存储在一个单独的数组中,并将对象数组转换为一个以键为ID的对象。

来自Normalizr的示例

[{
  id: 1,
  title: 'Some Article',
  author: {
    id: 1,
    name: 'Dan'
  }
}, {
  id: 2,
  title: 'Other Article',
  author: {
    id: 1,
    name: 'Dan'
  }
}]

可以归一化为-

{
  result: [1, 2],
  entities: {
    articles: {
      1: {
        id: 1,
        title: 'Some Article',
        author: 1
      },
      2: {
        id: 2,
        title: 'Other Article',
        author: 1
      }
    }
  }
}

当您的应用程序增长时,您将有多个reducer和子reducer。您可能希望对状态树的特定部分进行切片,等等。出于这个原因,有人可能会建议您以不同的方式存储状态。

但是,如果你让它工作,任何事情都可以工作!好运!