【问题标题】:Redux Thunk getState() is returning all statesRedux Thunk getState() 正在返回所有状态
【发布时间】:2018-03-18 10:19:04
【问题描述】:

刚刚发现我可以使用 getState() 将状态值传递给动作创建者。但是我注意到 getState() 正在返回所有组合状态,而不是参数中指定的状态。我做错了什么,因为我认为这不是正确的行为?

减速机:

import { combineReducers } from "redux";
import { reducer as reduxForm } from "redux-form";
import authReducer from "./authReducer";

export default combineReducers({
  auth: authReducer,
  form: reduxForm
});

动作创建者 sn-p:

export const handleProviderToken = token => async (dispatch, getState) => {
  let testState = getState("auth");
  console.log(testState); 
  const res = await axios.get(`${API_URL}/api/testEndpoint`);
  dispatch({ type: FETCH_USER, payload: res.data });
};

console.log(testState) 向我展示了整个状态树对象(身份验证和表单,而不仅仅是身份验证)。

【问题讨论】:

  • redux 怎么会知道你对状态的哪个部分感兴趣?唯一将你的动作创建者链接到特定减速器的事情是动作中的一些调度调用,它会触发一个动作,减速器中存在某处的案例。它必须自省大量代码才能“猜测”这些信息。即使这还不够,它还必须检查你的减速器是如何组合的。因此,它对此是不可知的。
  • 我认为 Redux 知道哪个状态是通过将状态作为参数传递给 getState().. 但现在我明白它是如何工作的了。

标签: reactjs redux redux-thunk


【解决方案1】:

引用 redux-thunk 文档

内部函数接收 store 方法 dispatch 和 getState 作为 参数。

并引用 redux 的文档

getState()  返回应用程序的当前状态树。这是 等于 store 的 reducer 返回的最后一个值。

所以你通过 redux-thunk 传递的 getState 实际上是 redux 的 getState() 函数本身,因此它是默认行为。

要从状态树中获取特定值,您可以使用以下任一方法

const { auth } = getState() 
// OR
const testState = getState()
const auth = testState.auth

【讨论】:

    【解决方案2】:

    这是正确的行为。 From docs:

    返回应用程序的当前状态树。它等于 store 的 reducer 返回的最后一个值。

    【讨论】:

      【解决方案3】:

      这是正确的行为。您将需要从完整状态中选择 reducer 键。

      export const handleProviderToken = token => async (dispatch, getState) => {
        let testState = getState();
        let authReducer = testState.auth; 
        const res = await axios.get(`${API_URL}/api/testEndpoint`);
        dispatch({ type: FETCH_USER, payload: res.data });
      };
      

      【讨论】:

        【解决方案4】:

        在类似情况下对我有用的是

        const lastFetchedPage =getState().images.lastFetchedPage;
        

        不过,我不知道它与指南的关系如何。

        【讨论】:

          猜你喜欢
          • 2018-09-28
          • 1970-01-01
          • 2019-08-06
          • 2020-10-25
          • 1970-01-01
          • 2018-06-03
          • 2018-11-16
          • 2018-01-31
          • 2021-10-04
          相关资源
          最近更新 更多