javascript - Typescript:如何在 Redux 中输入 Dispatch

标签 javascript typescript redux react-redux dispatch

例如,我想在此处删除 dispatch: any:

export const fetchAllAssets = () => (dispatch: any) => {
  dispatch(actionGetAllAssets);
  return fetchAll([getPrices(), getAvailableSupply()]).then((responses) =>
    dispatch(actionSetAllAssets(formatAssets(responses))));
}

我在上面分派(dispatch)了 2 个 Action ,actionsGetAllAssetsactionsSetAllassets

以下是两者的接口(interface)和 actionCreators:

// Interfaces
interface IActions {
  GET_ALL_ASSETS: string;
  SET_ALL_ASSETS: string;
  GET_MARKET_PRICES: string;
  SET_MARKET_PRICES: string;
  ADD_COIN_PORTFOLIO: string;
  ADD_COINS_PORTFOLIO: string;
  UPDATE_COIN_PORTFOLIO: string;
  REMOVE_COIN_PORTFOLIO: string;
} 

interface IGetAllAssets {
  type: IActions['GET_ALL_ASSETS'];
  loading: boolean;
}

interface ISetAllAssets {
  type: IActions['SET_ALL_ASSETS'];
  assets: IAsset[];
  loading: boolean;
}

// ACTION CREATORS
const actionGetAllAssets = () => ({
  type: Actions.GET_ALL_ASSETS,
  loading: true
});

const actionSetAllAssets = (data: any) => ({
  type: Actions.SET_ALL_ASSETS,
  assets: data,
  loading: false
});

然后我尝试了以下方法:

export const fetchAllAssets = () => (dispatch: IGetAllAssets | ISetAllAssets) => {
  console.log('fetchAllAssets', dispatch);
  dispatch(actionGetAllAssets);
  return fetchAll([getPrices(), getAvailableSupply()]).then((responses) =>
    dispatch(actionSetAllAssets(formatAssets(responses))));
}

但是它会产生这个 Typescript 错误:

Cannot invoke an expression whose type lacks a call signature. Type 'IGetAllAssets | ISetAllAssets' has no compatible call signatures.ts(2349)

想法?或者是否有不同的方式来输入调度事件?

最佳答案

Redux 类型有一个通用的 Dispatch<A>您可以使用的类型,其中 A是 Action 的类型。

export const fetchAllAssets = () => (dispatch: Dispatch<IGetAllAssets | ISetAllAssets>) => {
  // ...
}

关于javascript - Typescript:如何在 Redux 中输入 Dispatch,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54844839/

相关文章:

angular - 我可以在 Angular 模板中进行类型缩小吗?

javascript - 在 Dashing Widget 的 Coffeescript 中加载 `ready` 上的数据

javascript - 如何重用map函数中的对象?

angular - Jasmine : How to SpyOn a method callback : method. then()

reactjs - 从 redux-saga 中调用 redux-form 调度(change)

javascript - 如何为单个 multireducer 子切片提供初始状态

reactjs - 如何使用 redux-form 进行重新选择

Javascript 错误停止 $document.ready()

javascript - 如何在不显示其 css 的情况下通过 onClick() javascript 查看特定 html 标签的源代码?

javascript - 以正确的延迟动画箭头?