我是Redux RTK的新手，我有点困惑。有没有像React的useState中那样的setState使用方法？
例如，我有这样的代码，我从一个API中获取一些数据，然后创建一些extraReducers。
但是我很疑惑，我有一个handleChange的下拉菜单，但是到目前为止我还没有弄清楚如何setState onChange：
export const getPlayers = createAsyncThunk<IPlayerProps[]>('players/getPlayers', async (_, _thunkApi) => {
try {
const response = await axios.get(
'https://6360055fca0fe3c21aaacc04.mockapi.io/player'
);
return response.data;
} catch (error) {
return _thunkApi.rejectWithValue(error);
}下面是切片器：
export const playerSlice = createSlice({
name: 'players',
initialState,
reducers: {
setPlayers: (state, action: PayloadAction<IPlayerProps[]>) => {
state.players = action.payload;
}
},
extraReducers: (builder) => {
builder.addCase(getPlayers.pending, (state) => {
state.loading = true;
});
builder.addCase(getPlayers.fulfilled, (state, action) => {
state.players = action.payload;
state.loading = false;
});
builder.addCase(getPlayers.rejected, (state, action) => {
state.loading = false;
state.errors = action.payload;
})
}
});
export default playerSlice.reducer;
export const { setPlayers } = playerSlice.actions;这里我用target的值做一个简单的setState：
const handleChange = (e: SelectChangeEvent<string>) => {
setState(e.target.value);
};任何帮助都将不胜感激！：）
1条答案
按热度按时间lvmkulzt1#
如果我正确理解了您的问题，useState用于在同一文件中本地保存或更新数据，并且保存的数据在项目中无法全局访问。
但是使用redux，所有项目都可以访问共享数据存储。
因此，Redux的工作方式与react的useState钩子不同。
因此，要在redux中更新、更改、删除或添加值，我们使用dispatch调用操作并强制redux状态更新。
例如：
假设您在redux中有一个名为getPlayers的操作，因此当您调用此操作时，它应该基于特定类型返回数据，并在redux reducer状态下保护它。
因此，要调用该操作，您应该使用
import useDispatch并使用它，它将触发redux操作，并且您应该使用import useSelector，它将从redux获取数据（换句话说，每当您在redux中触发一个操作并更新redux状态时，useSelector将自动更改您正在使用的文件中的数据，因此行为将与setState相同）：最后，如果您希望在单击时更新变量，则应该在redux中创建一个操作，该操作将更新redux状态下的变量，可以使用dispatch调用该操作，并将变量更新为useState行为。
我知道这听起来可能很复杂，但是一旦你得到了架构，redux在很多情况下都是非常有帮助的，祝你好运！如果你需要什么或者有任何问题，请告诉我。
这里有一篇简短的文章，可以帮助您了解redux good architecture（Best Redux architecture explained in 5 minutes