如何根据传入参数通过useSelector为单个变量分配条件选择器？

我想在自定义Hook里只用单个变量selectorValue，但useSelector的选择器函数要根据传入的参数动态变化。比如传入physical就用实体书的选择器，传入ebooks就用电子书的选择器，实际场景里有4种以上的选择器类型。示例代码大概是这样的：

const myDataHook = ({ targetSelector }: { targetSelector: string }) => {
  // 这只是示例，实际这么写有问题
  const selectorValue: string = useSelector(() => {
    if (targetSelector === SELECTOR_A) return getSelector_A_Values();
    else {
      return getSelector_B_Values();
    }
  });
  // ...其他逻辑
}

但Hook必须在顶层调用，没法用条件语句分别调用不同的useSelector，useEffect也解决不了。我不想声明多个选择器变量，因为每次Hook只会用到其中一个，请问这个需求可行吗？

当然可以实现，核心思路是提前把所有选择器函数做成映射表，根据传入的参数动态匹配对应的选择器，再传给useSelector——这样既不用条件调用Hook，也能只用单个变量接收结果。

具体分两种场景处理：

场景1：选择器是无依赖的稳定函数 #

如果你的各个选择器函数都是独立、不需要动态参数的，直接做个映射表就行：

// 先把所有选择器函数存到映射表里
const selectorMap = {
  [SELECTOR_A]: getSelector_A_Values,
  [SELECTOR_B]: getSelector_B_Values,
  // 把你需要的4+个选择器都加进来
};

const myDataHook = ({ targetSelector }: { targetSelector: string }) => {
  // 根据传入的参数拿到对应的选择器
  const currentSelector = selectorMap[targetSelector];
  
  // 直接传给useSelector，只用单个变量接收结果
  const selectorValue = useSelector(currentSelector);
  
  // ...你的其他逻辑
  return selectorValue;
};

场景2：选择器需要动态参数或依赖 #

如果选择器需要结合targetSelector做动态逻辑，用useCallback包裹选择器，保证它的引用稳定（避免useSelector无意义重渲染）：

const myDataHook = ({ targetSelector }: { targetSelector: string }) => {
  // 用useCallback创建稳定的选择器函数，只有targetSelector变化时才更新
  const currentSelector = useCallback((state) => {
    switch(targetSelector) {
      case SELECTOR_A:
        return getSelector_A_Values(state);
      case SELECTOR_B:
        return getSelector_B_Values(state);
      // 其他选择器的case
      default:
        return null; // 或者你需要的默认值
    }
  }, [targetSelector]);

  const selectorValue = useSelector(currentSelector);
  
  // ...你的其他逻辑
  return selectorValue;
};

这种写法完全符合Hook的规则，既不用声明多个选择器变量，也能实现根据参数动态切换选择器的需求。

内容的提问来源于stack exchange，提问作者wanna_coder101