reactjs - 如何将 React proptypes 类型化组件作为任何类型导入 React Typescript 组件

Question

我们在 proptypes 中完成了一个相当大的组件库，我们正在转向 typescript 。
因此，当我将 .jsx 组件移动为 .tsx 组件时，导入的 .jsx 组件突然开始抛出输入错误，导入的组件目前没有任何问题，我不能只是重写它 typescript ，因为它无处不在，并且此刻的努力比值得的多。
为了解决这个问题，我做了如下(删除了很​​多中间代码)

import MyReactComponent from 'path/to/component';

const FixedMyReactComponent: any = MyReactComponent;

return <FixedMyReactComponent/>

它有效，我的错误消失了，但我觉得这很烦人，我宁愿不必制作 FixedMyReactComponent 并在本地为其设置类型，并且(正如我已经说过的)我不想放入现在是时候解决 typescript 不理解我的组件的事实了，所以我想找到某种方法来全局告诉 typescript 忽略您从 js/jsx 获得的类型错误并且只报告来自 .ts/.tsx 的错误.
我想它会是这样的

declare module '*.jsx' {
  var _: React.Component<any, any>;
  export default _;
}

但这似乎没有我想要的效果。

Answer 1

将你的 proptype 移动到一个类型，然后你就可以输入你的组件。

import { FC } from 'react'

type FixedMyReactComponentProps = {
  id: string;
  name: string;
}

const FixedMyReactComponent: FC<FixedMyReactComponentProps> = ({name, id}) => {
...
}

但是，如果您必须将其输入为 any。您声明返回类型:

const FixedMyReactComponent = (): any => {
  ...
}