如何使用typescript在reactjs中传递数据

IT技术 reactjs components pass-data tsx
2021-05-21 16:59:09

如何使用 tsx 将对象传递给 reactjs 中的子组件。当我尝试这种方式时出现此错误。我可以在哪里声明类型？ Property 'value' does not exist on type 'IntrinsicAttributes & IntrinsicClassAttributes<ShipmentCard>

卡片.tsx 

  render() {
    return (
      <div>
        {this.state.card.map((card: any) => (
          <ShipmentCard key={card.id} value={card}/>
        ))}
      </div>
    );
  }

完整的错误信息是：

输入 '{ 键：任意；数据：任何；}' 不可分配到类型 'IntrinsicAttributes & IntrinsicClassAttributes & Readonly<{}> & Readonly<{ children?: ReactNode; }>'。属性“数据”不存在于类型“IntrinsicAttributes & IntrinsicClassAttributes & Readonly<{}> & Readonly<{ children?: ReactNode; }>'

2个回答

如果您使用的是typescript，那么您必须在 ShipmentCard.tsx 中声明所有props

interface ShipmentCardProps {
    key: string;
    value: {}
}

interface ShipmentCardState {}

class ShipmentCard extends React.Component<ShipmentCardProps, ShipmentCardState> {
}
export default ShipmentCard

试试这个。你的州有“卡”吗？好像没有。您需要从父组件获取props。您需要尝试使用props传递数据。所以阅读链接。并尝试使用 redux。

其它你可能感兴趣的问题
上一篇React Native 中 Java 单例的等价物是什么？ 下一篇MUI 组件上的渐变边框