如何将 react-redux 'useSelector' 与附加变量一起使用？

Question

我有一个redux(子(状态，它由大量类似的条目组成。

export type PartnerCalculatorStateShape = {
m16_19:number;
m20_24:number;
m25_34:number;
m35_44:number;
m45_64:number;
m65_plus:number;
f16_19:number;
f20_24:number;
f25_34:number;
f35_44:number;
f45_64:number;
f65_plus:number;
};

我使用的是Redux Toolkit，所以我的reducer是这样的形式(注意，Redux Toolkit使用不可变的更新逻辑，所以我可以直接分配修改状态(

type PartnerCalculatorPayload = {
key:string;
value:number;
}
export const partnerCalculatorSlice = createSlice({
name: 'PartnerCalculator',
initialState,
reducers: {
partnerCalculatorValueReceived(state, action: PayloadAction<PartnerCalculatorPayload>) {
state[action.payload.key] = action.payload.value;
}
}
});

我有点纠结于如何使用useSelector。我想做的是在我的Redux文件中有一个选择器函数，类似于这个

export const selectorFunction = (state,key) => state[key]

其中key将是例如m20_24。然后我会在我的React组件中使用选择器功能

const myVar = useSelector(selectorFunction)

但是我该如何传递钥匙呢？

官方hooks文档建议使用闭包传递额外的变量

import React from 'react'
import { useSelector } from 'react-redux'
export const TodoListItem = props => {
const todo = useSelector(state => state.todos[props.id])
return <div>{todo.text}</div>
}

然而。useSelector将在我的React组件中，我想将传递给useSelector的选择器函数保留在redux文件中，所以我看不到如何使用闭包。

我想我可以从我的选择器功能中传递整个状态

const selectorFunction = state => state

然后把它当作我React组件中的一个对象，并在那里键入

const myState = useSelector(selectorFunction)
const myVar = myState["m20_24"]

但这看起来有点难看。

如果是这样的话，myVar会在我的Redux状态中的任何字段发生变化时更新吗？我有点不清楚useSelector等式测试机制是如何工作的——它说它使用"严格等式"，所以如果我的状态对象的任何部分发生了变化(也就是说，如果字段"m20_24"发生了变化(，那么myVar会被更新吗？

感谢您的真知灼见！

Answer 1

将一个匿名选择器传递给useSelector，然后调用其中的实际选择器：

const value = useSelector(state => selectValueByKey(state, props.key));