关于extraReducers中action的问题
来源：10-8 【redux-toolkit】sotre配置(configureStore)与异步处理(createAsyncThunk)
慕神7231064
2021-07-08
createAsyncThunk方法中返回一个对象。
在extraReducers方法中的
[getLogin.fulfilled.type]:(state,action)=>{
console.log('action',action)
state.loading = false;
state.token = action.payload
},
这个action是怎么传递过来的。里面的payload又是怎么传递的示例代码如下
export const getLogin = createAsyncThunk('signIn/getLogin',
async (param:{ email:string,password:string },thunkAPI)=>{
const { data } = await axios.post('http://123.56.149.216:8080/auth/login',param)
console.log(data.token)
return data.token
})
export const signIn = createSlice({
name:'signIn',
initialState,
reducers:{},
extraReducers:{
[getLogin.pending.type]:(state)=>{
state.loading = true
},
[getLogin.fulfilled.type]:(state,action)=>{
console.log('action',action)
state.loading = false;
state.token = action.payload
},
[getLogin.rejected.type]:(state)=>{
state.loading = false
}
}
})写回答
1回答
-
阿莱克斯刘
2021-07-23
课程的问题太多，你的问题沉下去了，刚刚才找到到，拖了这么久不好意思。
“这个action是怎么传递过来的”？
action 作为 reducer “getLogin.fulfilled”的第二个参数被传递进来，而getLogin.fulfilled则是rtk的语法糖自动生成的。
“里面的payload又是怎么传递的”？
action中的payload就是你自己在调用的时候传递进来的了。比如 reducer getLogin.fulfilled 会在 getLogin 请求api成功以后自动调用，payload 则是 getLogin 请求成功以后retun的数据，也就是“return data.token”。
00
相似问题