У меня есть состояние 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 , поэтому мой редуктор имеет эту форму ( обратите внимание, что Redux Toolkit использует неизменяемый журнал обновлений c, поэтому я могу назначить изменение состояния напрямую)
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)
Но как мне передать ключ?
Официальная документация по хукам рекомендует использовать закрытие для передачи дополнительные переменные
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"]
, но это кажется некрасивым.
Если это способ go, будет ли myVar
обновляться в любое время при изменении любого из полей в моем состоянии Redux? Я немного не понимаю, как работает механизм проверки useSelector - он говорит, что использует «строгое равенство», поэтому, если какая-либо часть моего объекта состояния изменилась (то есть, если поле 'm20_24 'изменено), тогда myVar
будет обновлено?
Спасибо за любые идеи!