Redux Toolkit useAppDispatch 缺少Action类型智能提示如何解决

• 第一步：确保AppDispatch类型是从你的store实例直接推导得出，不能手动声明为通用Dispatch类型。你创建store的文件（通常为store.ts）需要按如下方式定义类型：

import { configureStore } from '@reduxjs/toolkit'
// 导入你所有的slice reducer
import counterReducer from './features/counter/counterSlice'

export const store = configureStore({
  reducer: {
    counter: counterReducer,
    // 其余reducer都在此处注册
  },
})

// 核心：直接从store实例推导类型，会自动包含所有slice的action类型和中间件类型
export type AppDispatch = typeof store.dispatch
export type RootState = ReturnType<typeof store.getState>

• 第二步：确认你自定义的useAppDispatch钩子导入的是上述从store推导出来的AppDispatch类型，你的钩子写法本身没有问题，只需保证泛型绑定的是正确的AppDispatch即可：

import { useDispatch } from 'react-redux'
import type { AppDispatch } from './store'

export const useAppDispatch = () => useDispatch<AppDispatch>()

• 第三步：所有组件中调用dispatch时统一使用自定义的useAppDispatch，不要使用原生的useDispatch。

配置完成后，TypeScript会自动识别所有合法的Action类型，悬浮查看dispatch类型时也不再是通用的AnyAction签名，会显示你项目中实际支持的Action联合类型，智能提示功能会正常生效。

内容的提问来源于stack exchange，提问作者Md Rafee