如何修复打字稿中丢失的类型

我们可以id通过使用类型注释来表明我的项目没有，这表明它是可选的。

首先，让我们声明一个类型：

interface Item {
  id?: string;
  row: number;
  assetType: string;
  status: string;
}

在?对id上述表示它是一个可选属性。可以指定也可以不指定。

现在应用它：

DATA: { data: Item[] } = {
  data: [
    { id: "1r5WioSdYLVqp", row: 1, assetType: "1r5WioSdYLVqp", status: "" },
    { id: "w1muKlmY4lsR", row: 2, assetType: "w1muKlmY4lsR", status: "" },
    { id: "1foDN2HDHiAbT", row: 3, assetType: "1foDN2HDHiAbT", status: "" }
  ]
};

new = { row: 1, assetType: "1fKBO4w0XHg7H", status: "ACTIVE" }
constructor() { }

ngOnInit() {
  console.log(this.DATA);

  this.DATA.data.forEach((dt, index) => {
    if (dt.row === this.new.row) {
      this.DATA.data[index] = this.new; // no error.
    }
  });

  console.log(this.DATA)
}

注意，我以对象常量类型的形式添加了其他类型{ data: Item[] }。这样做是因为问题中的代码嵌套。如果DATA仅具有一个属性，data则将其展开以简化内容。

那你可以写

data: Item[] = [
  { id: "1r5WioSdYLVqp", row: 1, assetType: "1r5WioSdYLVqp", status: "" },
  { id: "w1muKlmY4lsR", row: 2, assetType: "w1muKlmY4lsR", status: "" },
  { id: "1foDN2HDHiAbT", row: 3, assetType: "1foDN2HDHiAbT", status: "" }
]

这更容易阅读和编写。或者，我们可以为外部对象声明类型

interface DataWrapper {
  data: Item[];
}

DATA: DataWrapper = {
  data: [
    { id: "1r5WioSdYLVqp", row: 1, assetType: "1r5WioSdYLVqp", status: "" },
    { id: "w1muKlmY4lsR", row: 2, assetType: "w1muKlmY4lsR", status: "" },
    { id: "1foDN2HDHiAbT", row: 3, assetType: "1foDN2HDHiAbT", status: "" }
  ]
}

最后，与此无关，我们可以通过删除不必要的来清理这段代码forEach。

const index = this.DATA.data.findIndex(({row}) => row === this.new.row);
if (index !== -1) {
  this.DATA.data[index] = this.new;
}