Question

我是TypeScript的新手。我不知道如何为我的ID名称价格和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"));

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

Answer 1

data是一个包含具有以下属性的对象的数组：

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

Answer 2

您是否已经为数据定义了类型？我看不到它，但是您想使用它，或者如果它不存在，请创建一个。例如：

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

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

Answer 3

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

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

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

如何使用TypeScript在带有响应的对象中编写状态类型？

3 个答案: