Redux中状态树中分支之间的依赖关系

时间:2018-01-05 19:19:26

标签: redux redux-thunk

我有一个带有以下分支的状态对象(试图遵守"Normalizing the state shape"):

用户

这样的元素数组
{
  id: 1,
  name: "Werner"
}

来自某个服务器。

用户位置

这样的元素数组
{
  userId: 1,
  latitude: 45,
  longitude: 70
}

来自某个服务器。

问题

用户可能会根据一系列操作进行更改:SET_USERS_ACTIONADD_USER_ACTIONDELETE_USER_ACTION

每当用户发生某些事情时,我想更新用户位置(这是一个异步操作,因为数据需要来自服务器)。事情的如何就是我正在努力的事情。

显然,我无法在reducer中获取用户位置(更新用户时),因为在这种情况下reducer将不再是纯粹的。

我可以在thunk中执行此操作,但这意味着我必须向涉及用户操作的每个操作创建者添加用户位置注意事项,这对我来说似乎是mixing concerns

此外,一旦添加了以某种方式更改用户数组的操作,开发人员需要记住来更新用户位置。我的经验是,这样的东西几乎总会被遗忘。

进一步的并发症

为了使问题进一步复杂化,我们总是需要获取位置。仅当显示包含所有用户的地图的组件处于活动状态时,才能获取用户位置。并非每个动作都是在我知道(事先)的地方生成的,如果该组件可见或不可见。一个例子是当我们从服务器(带有Web套接字)收到添加或删除用户的通知时。

解决这个问题的最佳方法是什么?

1 个答案:

答案 0 :(得分:0)

我建议使用https://github.com/kolodny/immutability-helper使用update帮助程序的好处是,您可以一次执行多项更改,而无需多次触摸状态。例如:

import update from 'immutability-helper';

...
case SET_USERS_ACTION:
  return update(
    state,
    {
      users: {
        [idx]: { status: { $set: 'ready' }}
      },
      locations: {
        $push: [{...}]
      }
    }
  );
break;