繁体   English   中英

如何使用 TypeScript 为 state 编写带有反应对象的类型?

[英]How to write types for state with objects in react using TypeScript?

我是 TypeScript 的新手。 我不知道如何为我的 id 名称 price 和 q 编写类型。 这个怎么做? 请告诉我该怎么做

type State = {
  data:[],
  id:number,
  name:string,
  price: string,
  q: number,
  count: []
}
class Shop extends React.Component<{}, State> {
  constructor(props) {
    super(props);
    this.state = {
      data: [
        {
          id: 1,
          name: "Product 1",
          price: "50",
          q: 0
        },
        {
          id: 2,
          name: "Product 2",
          price: "70",
          q: 0
        }
      ],
      count: []
    };
  }


  render() {
    return (
      <div className="wrap">
        <ProductList products={this.state.data} />
        <CartList cart={this.state.count} />
      </div>
    );
  }
}
ReactDOM.render(<Shop />, document.getElementById("root"));

预期类型来自属性“数据”,该属性在此处以“只读”类型声明

data是一个包含具有这些属性的对象的数组:

type State = {
  data: {
    id:number,
    name:string,
    price: string,
    q: number
  }[],
  count: []
}

您是否已经为您的数据定义了类型? 我没有看到一个,但如果它不存在,你会想要使用它或创建一个。 例如:

type Data = {
  id: number;
  name: string;
  price: string;
  q: number;
}

type State = {
  data: Data[],
  count: any[]
}

您的数据类型定义应包含 object 属性。

type StateDataElement = {
  id: number,
  name: string,
  price: string,
  q: number
}

type State = {
  data: StateElement[],
  count: []
}

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM