为什么?类型' asyncthunkaction< any,void,{}>'不能分配给类型的参数' AnyAction'

发布于 2025-01-27 13:30:29 字数 1777 浏览 3 评论 0原文

我有这个错误,没有发现相关答案

类型'asyncthunkaction< any,void,{}>'的参数不能分配给类型“ AnyAction”的参数。

<MenuItem
    onClick={() => {
        dispatch(logout()) // <<--HERE
    }}
/>
// slices/tikexAPI.ts
export const logout = createAsyncThunk(`${namespace}/logout`, async () => {
    const { data } = await axios({
        method: 'post',
        url: 'logout',
        headers: { crossDomain: true },
    })
    return data
})

const tikexAPI = createSlice({
    name: 'authnUser',
    initialState,
    reducers: {
        setAuthnRes(state, action: PayloadAction<AuthnRes | null>) {
            state.resp = action.payload
        },
    },
    extraReducers: (builder) => {
        builder
            .addCase(logout.fulfilled, (state, { payload }) => {
                state.authnRes = null
            })
//store.ts

import { configureStore, createSelector } from '@reduxjs/toolkit'
import tikexAPI from './tikexModule/slices/tikexAPI'

export const store = configureStore({
    reducer: { tikexAPI: tikexAPI },
})

我只有两个Redux软件包重新安装了它们,这无济于事。

// package.json

{
    "dependencies": {
        "@reduxjs/toolkit": "^1.8.1",
        "react-redux": "^8.0.1",

在本教程之后,它对我有用,很奇怪: https://www.youtube.com/watch.com/watch.com/watch.com/watch.com/watch ?v = xtd4ymkwi7w

kukodajanos@Kukoda-MacBook-Pro-2 Team % yarn why redux
yarn why v1.22.18
[1/4] 
              

I got this error, found no relevant answer in SO

Argument of type 'AsyncThunkAction<any, void, {}>' is not assignable to parameter of type 'AnyAction'.

<MenuItem
    onClick={() => {
        dispatch(logout()) // <<--HERE
    }}
/>
// slices/tikexAPI.ts
export const logout = createAsyncThunk(`${namespace}/logout`, async () => {
    const { data } = await axios({
        method: 'post',
        url: 'logout',
        headers: { crossDomain: true },
    })
    return data
})

const tikexAPI = createSlice({
    name: 'authnUser',
    initialState,
    reducers: {
        setAuthnRes(state, action: PayloadAction<AuthnRes | null>) {
            state.resp = action.payload
        },
    },
    extraReducers: (builder) => {
        builder
            .addCase(logout.fulfilled, (state, { payload }) => {
                state.authnRes = null
            })
//store.ts

import { configureStore, createSelector } from '@reduxjs/toolkit'
import tikexAPI from './tikexModule/slices/tikexAPI'

export const store = configureStore({
    reducer: { tikexAPI: tikexAPI },
})

I have only two Redux package, reinstalled them, did not help.

// package.json

{
    "dependencies": {
        "@reduxjs/toolkit": "^1.8.1",
        "react-redux": "^8.0.1",

Following this tutorial, it works for me, strange: https://www.youtube.com/watch?v=xtD4YMKWI7w

kukodajanos@Kukoda-MacBook-Pro-2 Team % yarn why redux
yarn why v1.22.18
[1/4] ????  Why do we have the module "redux"...?
[2/4] ????  Initialising dependency graph...
[3/4] ????  Finding dependency...
[4/4] ????  Calculating file sizes...
=> Found "[email protected]"
info Reasons this module exists
   - "@reduxjs#toolkit" depends on it
   - Hoisted from "@reduxjs#toolkit#redux"
info Disk size without dependencies: "244KB"
info Disk size with unique dependencies: "1.06MB"
info Disk size with transitive dependencies: "1.11MB"
info Number of shared dependencies: 2
✨  Done in 0.29s.
kukodajanos@Kukoda-MacBook-Pro-2 Team % npm ls redux
[email protected] /Users/kukodajanos/Workspace/Tikex/Portal/Team
└─┬ @reduxjs/[email protected]
  └── [email protected] 

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

指尖微凉心微凉 2025-02-03 13:30:29

似乎您没有正确使用正确键入的useappdispatch/useappselecter挂钩,至少这是该错误的最常见来源。请按照 typescript QuickStart


// app/store.ts

import { configureStore } from '@reduxjs/toolkit'
// ...

export const store = configureStore({
  reducer: {
    posts: postsReducer,
    comments: commentsReducer,
    users: usersReducer,
  },
})

// Infer the `RootState` and `AppDispatch` types from the store itself
export type RootState = ReturnType<typeof store.getState>
// Inferred type: {posts: PostsState, comments: CommentsState, users: UsersState}
export type AppDispatch = typeof store.dispatch

// app/hooks.ts

import { TypedUseSelectorHook, useDispatch, useSelector } from 'react-redux'
import type { RootState, AppDispatch } from './store'

// Use throughout your app instead of plain `useDispatch` and `useSelector`
export const useAppDispatch = () => useDispatch<AppDispatch>()
export const useAppSelector: TypedUseSelectorHook<RootState> = useSelector

It seems like you are not using correctly typed useAppDispatch/useAppSelector hooks, at least that is the most common source for that error. Please follow the TypeScript QuickStart.


// app/store.ts

import { configureStore } from '@reduxjs/toolkit'
// ...

export const store = configureStore({
  reducer: {
    posts: postsReducer,
    comments: commentsReducer,
    users: usersReducer,
  },
})

// Infer the `RootState` and `AppDispatch` types from the store itself
export type RootState = ReturnType<typeof store.getState>
// Inferred type: {posts: PostsState, comments: CommentsState, users: UsersState}
export type AppDispatch = typeof store.dispatch

// app/hooks.ts

import { TypedUseSelectorHook, useDispatch, useSelector } from 'react-redux'
import type { RootState, AppDispatch } from './store'

// Use throughout your app instead of plain `useDispatch` and `useSelector`
export const useAppDispatch = () => useDispatch<AppDispatch>()
export const useAppSelector: TypedUseSelectorHook<RootState> = useSelector
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文