React-Redux：getState() 不可用

Question

我在 redux 和 getState() 中遇到过这个非常令人沮丧的问题。我有这个异步 thunk:

export const getUser = () => async (dispatch, getState) => {
  try {
    dispatch(requestCurrentUser());
    const user = await apiService.getUser();
    console.log(user);
    debugger;
  } catch (e) {
    dispatch(failureCurrentUser(e));
  }
};

调试器按预期激活，但 getState() 未定义，仅 dispatch()。奇怪的是，如果我单步执行调用堆栈并到达第一行 export const getUser = () => async (dispatch, getState) => {，那里定义了 getState 但由于某种原因，当函数开始执行时，它变得不可用。

如果它有任何重要性 - 我在项目的根文件中调用 getUser()，在 useEffect() 中，如下所示：

  useEffect(() => {
    store.dispatch(getCurrentUser());
  }, []);

我必须通过 store 调用它，因为此根组件呈现 <Provider />.

此外，我正在使用 redux-toolkit，现在逐渐从纯 redux 迁移，因此采取行动。

Answer 1

Devtools 将从范围中删除未使用的变量，当您运行控制台中的以下代码和调试器断点处尝试访问 value 时，您将收到 Uncaught ReferenceError: value is not defined 错误。

function test (value){
  console.log('value is fine here:',value);
  return function something(){
   //here try to console log value in the console
   debugger;
   return 88
  }
}
test(22)()

所以在你的代码中你可以只使用getState并且它不会在优化后被删除：

export const getUser = () => async (dispatch, getState) => {
  try {
    //using getState here so it won't be removed from scope
    console.log(getState);
    dispatch(requestCurrentUser());
    const user = await apiService.getUser();
    console.log(user);
    debugger;
  } catch (e) {
    dispatch(failureCurrentUser(e));
  }
};

React-Redux：getState() 不可用

React-Redux: getState() not available

reactjs

redux

redux-thunk

redux-toolkit