Question

我创建了一个Custom Hook。在这个钩子中，我收到来自loadRates()的承诺：

export const actions = {
  updateRate: () =>
    loadRates()
      .then(response => ({
        type: types.UPDATE_RATE,
        value: response
      }))
      .catch(reject => ({
        type: types.ERROR_UPDATE_RATE,
        value: reject
      }))
};

export const reducer = (state, action) => {
  switch (action.type) {
    case types.UPDATE_RATE:
      return { ...state, rates: action.value, loading: false };
    case types.ERROR_UPDATE_RATE:
      return { ...state, error: action.value, loading: false };
    default:
      throw new Error("Action type must be defined");
  }
};

问题在于，即使我从response获得了loadRates()，我也会收到Action type must be defined错误，因为我的state是pending。 / p>

我该怎么做才能解决此问题？

谢谢！

编辑：codesandbox here

Answer 1

问题是来自{{1}的dispatch的{{1}}函数被无条件调用，useReducer中Store.js的返回。

此actions.updateRate参数必须是具有类型属性的对象（在redux中相同）。解决您的问题的一种方法是在诺言解决或拒绝时派遣。在redux中，您可以使用thunk，有一个库。话虽如此，我会明确说明一个thunk的工作原理，以便您更好地了解。让我们增强基本调度，并将其提供给上下文提供程序：

ratesReducer.js

您的异步操作现在可以是将分派作为参数的函数。

dispatch

这是更新的笔：https://codesandbox.io/s/3qx982292p。看看redux-thunk，这个问题不是新问题，并且已经有很多知识了。

自定义钩收到承诺

1 个答案: