如何在 Typescript 中将对象数组传递给 Class

Question

export interface ICars{
    carType?: string;
    carColors: string[];
}

export class Cars implements ICars{
    carType?: string;
    carColors: string[];

    constructor(data?: ICars){
        //here code is present to set the carType and car Color parameters.
    }
}

我正在从我的 React 组件中调用上面的 class，如下所示。

const carTemplate: Cars = new  Cars({
    carType: myUseStateObjForCars,
    carColors: myUseStateArrayForCars,
})

我的html如下

 const [myUseStateObjForCars, setMyUseStateObjForCars] = useState(0);
 const [myUseStateArrayForCars, setMyUseStateArrayForCars] = useState(0);

<input onChange={e=> setMyUseStateObjForCars(e.target.value)}
<input onChange={e=> setMyUseStateArrayForCars(e.target.value)}

当我将 Cars 作为单个对象时，这很好用。当我必须将对象数组传递给我的 Car class 时，我怎样才能达到同样的效果？不通过使用任何 for 循环或映射来设置我的汽车 class 中的每个对象来修改我的 class 汽车？我正在使用 react hooks、Redux、RxJS 和 typescript。

这可能吗，还是我做错了什么？对此的任何帮助将不胜感激，因为我是 react.js 、钩子和 typesciprt 的新手。

[
    {
        carType: "4wheeler";
        carColors: ["red", "green"];        
    },
    {
        carType: "2wheeler";
        carColors: ["pink", "yellow"];  
    }
]

Answer 1

我认为你的 class Cars 不应该实现 ICars，但如果你想实现它，试试这个：

export interface ICars{
    carType?: string;
    carColors: string[];
}

export class Cars implements ICars {
    carType?: string;
    carColors: string[];

    constructor(data?: ICars){
        //here code is present to set the carType and car Color parameters.
    }
}

// Add an extra class
export class CarList {
   private cars: Partial<Cars[]>;

   public constructor (cars: <Cars[]>) {
      this.cars = [];
   }

   public addCar (car: ICars) {
      this.cars.push(new Cars(carType: "Some value", ["red", "yellow"]));
   }
}

请记住，您可以实例化 class 汽车的对象，因此每个： const car = new Cars() 指的是单辆汽车，但CarList有一辆汽车属性

如何在 Typescript 中将对象数组传递给 Class

How to pass array of objects to Class in Typescript

reactjs

typescript

react-hooks

typescript2.0

typescript1.8