如何使用Redux (与AsyncThunkAction一起使用)解析“AsyncThunkAction”类型中缺少的“属性”类型？
如何使用Redux (与AsyncThunkAction一起使用)解析“AsyncThunkAction”类型中缺少的“属性”类型？
提问于 2020-06-06 21:40:14
我正在使用和下面的thunk/片。与其将错误设置为状态，我还以为我可以通过等待thunk承诺来解决这些错误，使用这里提供的示例，从而在本地处理这些错误。
我想我可以通过在这个州设置一个error来避免这样做，也许我应该这样做，但我有点想知道我在这方面做错了什么。
Argument of type 'AsyncThunkAction<LoginResponse, LoginFormData, {}>' is not assignable to parameter of type 'Action<unknown>'.
Property 'type' is missing in type 'AsyncThunkAction<LoginResponse, LoginFormData, {}>' but required in type 'Action<unknown>'将resultAction传递给match时会出现错误
const onSubmit = async (data: LoginFormData) => {
const resultAction = await dispatch(performLocalLogin(data));
if (performLocalLogin.fulfilled.match(resultAction)) {
unwrapResult(resultAction)
} else {
// resultAction.payload is not available either
}
};thunk:
export const performLocalLogin = createAsyncThunk(
'auth/performLocalLogin',
async (
data: LoginFormData,
{ dispatch, requestId, getState, rejectWithValue, signal, extra }
) => {
try {
const res = await api.auth.login(data);
const { token, rememberMe } = res;
dispatch(fetchUser(token, rememberMe));
return res;
} catch (err) {
const error: AxiosError<ApiErrorResponse> = err;
if (!error || !error.response) {
throw err;
}
return rejectWithValue(error.response.data);
}
}
);切片：
const authSlice = createSlice({
name: 'auth',
initialState,
reducers: { /* ... */ },
extraReducers: builder => {
builder.addCase(performLocalLogin.pending, (state, action) => startLoading(state));
builder.addCase(performLocalLogin.rejected, (state, action) => {
//...
});
builder.addCase(performLocalLogin.fulfilled, (state, action) => {
if (action.payload) {
state.rememberMe = action.payload.rememberMe;
state.token = action.payload.token;
}
});
}
})谢谢你的帮助！
回答 3
Stack Overflow用户
回答已采纳
发布于 2020-06-06 21:57:05
非常肯定您使用的是标准的内置Dispatch类型，它不知道任何关于块的信息。
根据Redux和RTK文档，您需要定义一个更具体的AppDispatch类型，它正确地了解块并声明此处的dispatch是该类型，如下所示：
// store.ts
export type AppDispatch = typeof store.dispatch;
// MyComponent.ts
const dispatch : AppDispatch = useDispatch();
const onSubmit = async () => {
// now dispatch should recognize what the thunk actually returns
}Stack Overflow用户
发布于 2021-08-29 13:43:32
我必须将middleware: [thunk as ThunkMiddleware]添加到configureStore()中，以获得createAsyncThunk()的正确类型
Stack Overflow用户
发布于 2022-03-11 11:41:14
如果其他答案都没有帮助的话，最后为我工作的一件事就是：
- 删除
node_modules文件夹。 - 删除
yarn.lock/package-lock.json。 - 运行
yarn install/npm install。
如果您像我一样确保其他代码在其他代码中看起来都完全正确，那么这将为您解决这个问题。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/62238338
复制相关文章
相似问题
腾讯云开发者
