Typescript React Umijs3中useDispatch的then报错问题

新项目开始使用umijs3.0后,其目前只有typescript版本,所以也全面尝试使用typescirpt。
ts确实优势明显,变量类型清晰、优化提示、易维护,看API之类也清楚,就是项目需要写的的东西比以前翻了一倍,也难怪node内部放弃ts。
回归问题如下图:
Typescript React Umijs3中useDispatch的then报错问题_第1张图片
使用useDisptach的then会报错,虽然使用// @ts-ignore可以屏蔽问题,但是心里面总是毛毛的,一定要解决这个问题才可以:

TS2339: Property 'then' does not exist on type '{ type: string; payload: any; }'.

网上找了半天都是抄来抄去,只有dispatch(action),没有说dispatch的异步处理then问题。唯一一篇在stackoverflow上的文章:
https://stackoverflow.com/questions/59800913/type-safe-usedispatch-with-redux-thunk
也没有解决这个问题。
在官方文档的@umijs/plugin-dva处也没有关于dispatch的异步处理。
后面看了半天umijs、react-redux、redux的关于useDispatch说明,最后在umijs中找到其对Dispatch的定义。

export interface Dispatch {
  (action: T): Promise | T;
}

因此尝试了一下对dispatch声明类型为umijs的Dispatch类型:

import {Dispatch} from 'umi';

const dispatch: Dispatch = useDispatch();

就此解决该问题。如图:
Typescript React Umijs3中useDispatch的then报错问题_第2张图片

虽然结果很简单的解决了,但是解决问题的过程中碰壁不少,也在umijs的github提了该问题但是没有任何人答复。不知道使用的人是不是都不用dispatch的异步处理。

你可能感兴趣的:(typescript,react.js,umi,前端)