npm 包@types/react
允许我们在 TypeScript 应用程序中使用 React。我们将组件定义为
type Props = {...}
type State = {...}
export default class MyComponent extends React.Component<Props, State> {
}
这里我们必须声明组件 props 和 state 的类型(在类型变量中)。
在我们声明这些类型之后,TypeScript 使用它来验证我们组件的使用情况(传递给它的 props 的形状)。
我想围绕这样的组件创建一个容器。容器将重用组件的props。但是为了创建另一个具有相同 props 的组件,我必须再次重新声明 props 的类型。或者从原始组件文件中导出它们并导入到容器中:
// original file
export type Props = {...}
// container file
import MyComponent, { Props } from './original'
但我已经MyComponent
从那个文件导入了。这个组件已经包含了关于它消耗的 props 的信息(感谢在 中输入变量React.Component
)。
问题是如何在不显式导出/导入 props 类型的情况下从组件类本身访问该信息?
我想要这样的东西:
import MyComponent from './MyComponent'
type Props = MyComponent.Props // <= here access the component prop types
export default class MyContainer extends React.Component<Props, {}> {}