如何从 redux 工具包中的切片访问“选择器”

Question

所以，我对 redux 工具包还是个新手，我可能会做一些错误的事情。无论如何，我很好奇如何从 redux 中的存储/切片中提取我的“选择器”。

假设我有以下切片：

const mySlice = creatSlice({
    name: 'my-slice',
    initialState: {
      stuff: {
        primary: 'Things',
        secondary: 'Other Things',
      },
    },
    reducers: (create) => ({
      getStuff: create.asyncThunk(
        () => getSomeDataAsynchronously(),
        { ...justAssumeTheseUpdateStateWithData },
      ),
    }), 
    // this is the part I'm most interested in understanding better
    // I'm not even sure I'm doing it right. Is this how to handle
    // using arguments, or do I need to curry or something?
    selectors: {
      selectStuff: (state) => state.stuff,
      selectSpecificStuff: (state, key) => state[key] ?? 'not found',
    }
});

const store = configureStore({
  reducer: mySlice.reducer
});

所以这是我最困惑的地方。假设我已将该存储注入到我的

Provider

中，并且我正在使用子反应组件：

import { useSelector } from 'react-redux';

const MyComponent = () => {
  const selectSpecificStuff = useSelector(/* how to access from my slice? */);

  return <>{selectSpecificStuff('primary')}</>;
}

这可能吗？我似乎在文档中找不到任何有关它的信息，这让我想知道如果您无法访问它，选择器属性的意义是什么。

如有任何帮助，我们将不胜感激。

Answer 1

我还没有在 createSlice() 中尝试过选择器。但是，如果没有这些条目，以下内容应该可以工作：

const sliceOfInterest = useSelector(state => state['my-slice']);

现在，您可以访问 sliceOfInterest.stuff.primary 等

显然，你必须检查是否有不为空的东西。

此外，导出您的操作，以便您可以从其他地方调用它们

// 为每个 case 减速器函数生成动作创建者 导出 const { getStuff } = mySlice.actions;

不过，您不需要“获取”reducer 函数。让您的减速器功能来编辑/修改您的全局状态。使用上面所示的 useSelector 访问它们。

如果你有其他的reducer函数（在getSuff所在的代码区），你可以这样调用它们：

调度（getStuff（参数））