使用 createEntityAdapter 时，每个 React 组件都应该有自己的切片吗？

问题描述

我将 Redux-tokit 的 createSlice 和 createEntityAdapter 与规范化数据一起使用。

这是一个典型的博客应用（帖子、评论、用户） - 实体

通常，在使用 createEntityAdapter 之前，我会：

1. 在 postsSlice
   中获取、规范化和存储数据 所以我的 postSlice state 看起来像这样：
   blogPosts: {entities: {posts: {},users:{},comments: {}},ids:[]}
2. 从 id 的状态获取 postsSlice 到 Posts 组件
3. 将评论/用户 id 从 Posts 传递给子组件 - Comment User 组件，他们将使用传递的 id 获取数据选择器连接到父级的 postSlice 状态

const postsAdapter = createEntityAdapter();

const postsSlice = createSlice({
  name: "posts",initialState: postsAdapter.getinitialState(),reducers: {
    setPosts: (state,{ payload }) =>
      postsAdapter.setAll(state,payload.entities.posts),},});

---

问题在于：

• 使用createEntityAdapter时
  由于我们使用了 createEntityAdapter.getinitialState()，因此我们在每个切片中都获得了相同的 initialState {entities: {} ids: []} 模式。
• 而且这不允许像我以前那样有初始状态：
  blogPosts: {entities: {posts: {},ids:[]}

是否应该每个组件（Posts、User、Comment）都有自己的切片/reducer，并从同一端点使用 thunk 获取自己的数据?

这样： （根据 createEntityAdapter.getinitialState() 模式）

• postSlice 状态将只包含帖子实体 - entities: {posts: {},ids:[]}
• commentSlice 状态 - 评论实体 - entities: {comments: {},ids:[]}
• 等等...

解决方法

没有。 组件和 Redux 状态结构之间从来没有 1:1 的关联。相反，您应该organize your state in terms of your data types and update logic，并且组件应该根据自己的需要访问和重构该数据。

请注意，有 multiple ways to approach structuring that data in the store even if it's being normalized。例如，您可以将每种数据类型作为其自己的顶级切片，或者具有一个共享的 entities 化简器，其中每种类型都嵌套在其中。