Redux选择器对多对多

时间:2018-07-05 17:42:35

标签: reactjs redux

React + Redux建议保存规范化的数据,并使用选择器获取派生数据。因此,在我们的商店中,我们保存了UsersTags的多对多关系。

type Store = {
    entities: {
        users: User[];
        tags: Tag[];
        userTagMapping: { userId: string, tagId: string }[]
    }
}

在我们看来,我们想显示这种多对多关系的一些派生数据。例如,我们要计算带有标签的总用户数或带有标签的在线用户数。现在,我们使用rselect解决了这个问题。唯一的问题是计算这些东西变得很繁琐。例如,我们有一个选择器,它从一个标签ID返回一个映射到用户列表,以显示哪些用户属于该标签(反之亦然,一个从用户ID到标签列表的选择器)。

const selectUsersPerTag = createSelector(
    selectUsers, selectTags, selectUserTagMapping,
    (users, tags, mapping) => {
        let result = {};
        for (const tag on tags) {
             const isUserMappedToTag = user => ({userId, tagId}) => userId == user.id && tagId === tag.id
             result[tag.id] = users.filter(user => mapping.some(isUserMappedToTag(user)))
        }
        return result
    }
)

在我看来,这看起来很丑陋,很难理解。

我的问题是:

  • 我们是否正确理解了建议(使用归一化和选择器)?
  • 使用地图是处理数据并将其显示在视图中的正确方法还是有更好的方法?我问是因为这基本上将我们的数据(略作修改)多次复制到我们的React组件的道具中。
  • 是否有更好的方法来进行这种映射(基本上是一种类似于联接的SQL)?因为我真的不喜欢这种命令式方法,会发现一种更好的功能。

0 个答案:

没有答案