0

我有一个显示帖子列表的 Redux 应用程序。状态或多或少是这样的：

{
  posts: [
    {id: 1, title: 'My Post'},
    {id: 2, title: 'Also this one'},
    {id: 3, title: 'Other Post'}
  ],
  visible_post_ids: [1, 2]
}

每当我加载一些帖子时，我都会将它们添加到posts，然后我会替换visible_post_ids.

这是我加载帖子的动作创建者：

function loadPosts (filters) {
  return function (dispatch, getState) {
    return fetch(`/posts.json?filters=${filters}`)
      .then((response) => response.json())
      .then((posts) => {
        dispatch(postsLoaded(posts)) // Will update `posts`
        const postIds = posts.map((post) => post.id)
        dispatch(updateVisiblePosts(postIds)) // Will update `visible_post_ids`
      })
  }
}

我的问题是：从一个 thunk 发送两个（或更多）事件是否符合习惯？或者我应该只派出一个并在各种减速器中处理它？

4

2 回答 2

2

快速回答：从一个 thunk 调度两个或多个动作没有问题，我认为这是一个很好的做法，特别是如果 API 调用响应包含对两个完全不同的问题的答案。

我认为这取决于您要表示的内容，在您的情况下，您可以有一个表示添加新帖子的操作，并且两个不同的减速器可以捕获它并使用它执行不同的任务。但是您可以将其视为两个不同的操作（您的示例），这也很棒。

正如谢尔盖 L 所说，在您的情况下，通过独特的操作（对于您的情况），它可以创建一个有趣的“依赖关系”

于 2016-04-04T12:57:00.540 回答
1

如果您不考虑可以在不调用 updateVisiblePosts 的情况下进行 postLoaded 的情况，最好仅在 postsLoaded 中处理状态更改。特别是如果您需要它们同步。例如，如果您需要一个 visible_post_ids 不包含来自不存在/加载的帖子的 ID 的受让人。此外，它还最小化了更新，因为每次调度都会导致 React 中的处理。

另一方面，将这些动作分开可以使代码更清晰，因为每个动作的实现都非常简单。

于 2016-04-04T09:57:51.707 回答