我正在使用Typescript,React和Redux(均在Electron中运行)开发一个项目,当我将一个基于类的组件包含在另一个组件中并试图在它们之间传递参数时,我遇到了一个问题。宽松地说,容器组件具有以下结构:
class ContainerComponent extends React.Component<any,any> {
..
render() {
const { propToPass } = this.props;
...
<ChildComponent propToPass={propToPass} />
...
}
}
....
export default connect(mapStateToProps, mapDispatchToProps)(ContainerComponent);
和子组件:
interface IChildComponentProps extends React.Props<any> {
propToPass: any
}
class ChildComponent extends React.Component<IChildComponentProps, any> {
...
}
....
export default connect(mapStateToProps, mapDispatchToProps)(ChildComponent);
显然,我只包含基础知识,这两个类还有很多其他内容,但是当我尝试运行对我来说看起来像是有效代码的代码时,仍然出现错误。我得到的确切错误:
TS2339: Property 'propToPass' does not exist on type 'IntrinsicAttributes & IntrinsicClassAttributes<Component<{}, ComponentState>> & Readonly<{ childr...'.
当我第一次遇到该错误时,我以为是因为我没有传入定义道具的接口,但我创建了该错误(如您在上面看到的那样),但它仍然不起作用。我想知道,我缺少什么吗?
当我从ContainerComponent中的代码中排除ChildComponent prop时,它呈现的很好(除了ChildComponent没有关键的prop之外),但JSX Typescript中使用它拒绝编译它。我认为这可能与基于本文的连接包装有关,但是该文章中的问题出现在index.tsx文件中,并且是提供程序的问题,我在其他地方也遇到了问题。
React.Props
已被弃用!