React-Redux异步thunk中getState参数有定义但执行时不可用问题求解

1. Chrome DevTools 闭包变量优化 #

该现象大概率是Chrome调试工具的优化机制导致：如果异步函数内的参数未被实际引用，DevTools会将未使用的闭包变量标记为不可访问，视觉上呈现为undefined，但实际运行时调用是正常的。
验证方式：在debugger行之前添加代码console.log(getState)，再次运行后查看debugger状态下getState是否可访问，也可直接在调试控制台执行getState()验证是否能正常返回全局状态。

2. thunk函数定义与调用不匹配 #

贴出的thunk定义名为getUser，但调用时使用的是getCurrentUser()，需确认实际调用的thunk函数定义是否符合规范：
标准thunk要求为双层函数结构：

// 正确写法
export const getCurrentUser = () => async (dispatch, getState) => { 
  // 业务逻辑
}

// 错误写法（缺失外层包裹函数）
export const getCurrentUser = async (dispatch, getState) => { 
  // 业务逻辑
}

如果使用错误写法，调用dispatch(getCurrentUser())会导致thunk中间件无法正确注入参数，出现getState undefined的问题，修正为双层函数结构即可解决。

3. Redux Toolkit 中间件配置错误 #

如果使用configureStore时手动配置了middleware数组，会覆盖默认包含thunk的中间件列表，需手动保留默认thunk中间件：

// 错误写法：直接覆盖默认中间件
export const store = configureStore({
  reducer: rootReducer,
  middleware: [customMiddleware]
})

// 正确写法：保留默认中间件后追加自定义中间件
export const store = configureStore({
  reducer: rootReducer,
  middleware: (getDefaultMiddleware) => getDefaultMiddleware().concat(customMiddleware)
})

补充：在根组件渲染<Provider />前直接调用store.dispatch是合法操作，只要store实例已完成初始化，该调用方式不会导致getState参数异常。

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