Redux Toolkit中createAsyncThunk函数dispatch后未触发的问题

相关代码 #

feature.tsx #

import { fetchHistory } from "./featureSlice"
import { useAppDispatch, useAppSelector } from "../../app/hooks"

...

const featureData = useAppSelector(selectFeatureData)

useEffect(() => {
  console.log('one')
  dispatch(fetchFeature({}))
  console.log('three')
}, [])

...

{ featureData && <span>{JSON.stringify(featureData)}</span> }

featureSlice.ts #

export const fetchFeature = createAsyncThunk('feature/data', async (args: any, { getState }) => {
  console.log('two')
  return axios.get...
})

核心排查点 #

1. 导入错误：你在feature.tsx里导入的是fetchHistory，但实际调用的是fetchFeature，这会导致fetchFeature未被正确引入——要么是控制台有未定义变量的报错，要么是意外引用了全局同名变量。立刻把导入语句改成import { fetchFeature } from "./featureSlice"。
2. Slice未注册到Redux Store：检查你的featureSlice是否被正确添加到Store的reducer配置中。如果slice没注册，createAsyncThunk生成的action会被Redux忽略，不会触发内部逻辑。对比你那个能正常工作的AsyncThunk，参考它的slice注册方式即可。
3. 依赖与引用问题：虽然你用了空依赖数组，但如果fetchFeature的引用发生了不必要的变化（比如每次渲染都重新创建），也可能导致触发异常。不过结合你另一个AsyncThunk正常的情况，这个概率较低，优先排查前两点。
4. 静默类型错误（TS项目）：如果是TypeScript项目，检查是否有类型检查被忽略的情况——比如fetchFeature的类型和dispatch的预期不匹配，导致调用被静默拦截。

内容的提问来源于stack exchange，提问作者Anand Rockzz