const userSlice = createSlice({
name: 'user',
initialState,
reducers: {
// User k set korche
setUser: (state, action: PayloadAction<string | null>) => {
state.user.email = action.payload;
},
setLoading: (state, action: PayloadAction<boolean>) => {
state.isLoading = action.payload;
},
},
});
字符串
我想澄清action.payload
的概念。我为什么在这里使用它,它是做什么的。
1条答案
按热度按时间lawou6xi1#
给定Redux-Toolkit(RTK)切片:
字符串
和假定出口:
型
此切片生成一些内容,但最值得注意的是它生成上面的导出:
1.根据已声明的缩减器函数生成
setUser
和setLoading
操作函数。1.创建存储对象时传递给存储或与其他缩减器组合以形成缩减器树的切片缩减器函数。例如
configureStore
。我想澄清一下
action.payload
的概念。我为什么在这里使用它,它有什么作用?所有Redux操作函数都返回一个操作对象,例如返回具有
type
属性的对象。RTK生成的操作返回带有payload
属性的操作对象。这就是你在reducer函数中看到的action.payload
。例如,如果您从UI分派
setUser
动作,的字符串
这将首先调用带有字符串参数
"Drew"
的setUser
操作|null
,并返回一个操作对象{ type: "user/setUser", payload: "Drew" }
|{ type: "user/setUser", payload: null }
,它被传递到dispatch
函数,与dispatch({ type: "user/setUser", payload: "Drew" })
类似,以传递到约简树。然后,
setReducer
reducer函数将处理此"user/setUser"
操作类型,并访问操作对象的payload
属性。型
结果是
state.user.email
被设置为存储区中的有效负载值"Drew"
。类似地,您可以使用
setLoading
动作分派布林值。的字符串