Javascript 当状态树的两个分支具有相同的选择器名称时,如何管理redux选择器?

Javascript 当状态树的两个分支具有相同的选择器名称时,如何管理redux选择器?,javascript,redux,react-redux,Javascript,Redux,React Redux,例如,假设我们有一个称为game的切片状态。在游戏下我们有两个实体,敌人和物品。每个实体都有x坐标来记录其位置。状态树如下所示: { game: { enemies: { allEnemies: [ { id: 1, x: 100, }, { id: 3, x: 300, } ], allEnemies

例如,假设我们有一个称为
game
的切片状态。在
游戏下
我们有两个实体,
敌人
物品
。每个实体都有x坐标来记录其位置。状态树如下所示:

{
  game: {
    enemies: {
      allEnemies: [
        {
          id: 1,
          x: 100,
        },
        {
          id: 3,  
          x: 300,
        }
      ],
      allEnemiesById: [1, 3],
    },
    items: {
      allItems: [
        {
          id: 2,
          x: 200,
        },
        {
          id: 7,
          x: 500,
        }
      ],
      allItemsById: [2, 7],
    }
  }
}
当然,
敌人
实体和
物品
实体将具有其他不同的属性。在
game
reducer中还有其他逻辑,所以我不能简单地删除它

现在,在
游戏中
reducer中,我们有两个选择器分别获取可见的敌人和物品。他们在
敌人
项目
中委托选择器功能,因为我不想让
游戏
知道
敌人
项目
的状态树细节:

reducers/game.js

import { enemies, selector1 } from './enemies.js';
import { items, selector2 } from './items.js';
const getVisibleEnemies = (state) => selector1(state.enemies)
const getVisibleItems = (state) => selector2(state.items)
export const getVisibleEnemies = (state) => enemies.getVisibleEntities(state.enemies)
export const getVisibleItems = (state) => items.getVisibleEntities(state.enemies)
但现在的问题是:
selector1
selector2
的名称应该是什么?我考虑了一些解决方案,但我不太满意:

(1)
getVisibleEntities
:但在
游戏中不能有两个相同的函数名

(2)
getVisibleXXX
:但这与
游戏中的选择器名称相同

(3) 只需在客户端代码中直接调用
敌人
项目
的选择器,例如(
mapStateToProps
中获取可见敌人(state.game.敌军)
):但现在调用者必须知道状态树的深层形状,一旦状态树发生变化,将痛苦地改变所有状态树

(4) 在reducer函数中绑定选择器,例如:

减速器/敌人.js
导出常量getVisibleEntities(状态)=>{ //为敌人实现getVisibleEntities }

reducers/items.js
导出常量getVisibleEntities(状态)=>{ //项目的getVisibleEntities的实现 }

reducers/game.js

import { enemies, selector1 } from './enemies.js';
import { items, selector2 } from './items.js';
const getVisibleEnemies = (state) => selector1(state.enemies)
const getVisibleItems = (state) => selector2(state.items)
export const getVisibleEnemies = (state) => enemies.getVisibleEntities(state.enemies)
export const getVisibleItems = (state) => items.getVisibleEntities(state.enemies)
但我不确定将选择器设置为state reducer的属性是否是一个好主意

(5) 给它起一个稍微不同的名字,例如
game.js中的
getVisibleEneyemisimpl
toughts.js中的
getVisibleEneyemesimpl
:这很好,但我想知道应该有更好的方法来处理这个问题


那么你会怎么做呢?

我认为你应该选择选项(3),但是:

  • 选择器应该是整个Redux存储状态的函数
  • 这样,容器(智能组件)就不必知道状态树的深层形状