从对象数组中移除指定属性的实现问题求助

看起来你的代码里有几个关键问题导致删除列的逻辑没有正常工作，我来帮你逐一修复：

问题分析 #

1. 属性名笔误：你定义obj = this.receivedData[0];，但后续用了obj.values.columns，而原代码里是this.receivedData[0].value.columns（注意是value不是values），这会导致找不到要过滤的数组。
2. 硬编码删除属性：你固定删除Col_1，但应该根据要删除的列的id来动态删除对应行里的属性，不然不管删哪一列都只会删Col_1。
3. 缺少边界检查：没有确认this.receivedData[0]和this.receivedData[0].value.columns[el]是否存在，容易出现空指针错误。
4. 响应式更新问题：如果这是Angular项目，直接修改对象内部属性可能不会触发视图更新，需要确保变更检测能感知到数据变化。

修正后的代码 #

delColumn($event: any, el: any) {
  // 先做完整的边界检查，避免空指针
  if (!$event.target || el < 0 || !this.receivedData[0] || !this.receivedData[0].value?.columns) {
    return;
  }

  // 获取要删除的列的id
  const targetColumn = this.receivedData[0].value.columns[el];
  const colId = targetColumn.id;
  // 假设行里的属性名是Col_加上列id，比如Col_xxx，你可以根据实际情况调整
  const columnPropName = `Col_${colId}`;

  const obj = this.receivedData[0];
  // 过滤掉要删除的列（修正笔误：value不是values）
  obj.value.columns = obj.value.columns.filter(s => s.id !== colId);

  // 遍历所有行，动态删除对应属性
  obj.value.rows.forEach(row => {
    if (row.hasOwnProperty(columnPropName)) {
      delete row[columnPropName];
    }
  });

  // 如果是Angular项目，若视图没更新，可手动触发变更检测
  // import { ChangeDetectorRef } from '@angular/core';
  // constructor(private cdr: ChangeDetectorRef) {}
  // this.cdr.detectChanges();
}

关键改进点 #

• 完善的边界检查：提前过滤掉无效的输入和空数据，避免运行时报错。
• 修正属性名笔误：把obj.values.columns改为obj.value.columns，确保能正确访问列数组。
• 动态删除行属性：根据列的id生成对应的属性名（比如Col_${colId}），确保删除的是对应列的属性，而不是固定的Col_1。
• 可选的变更检测触发：如果是Angular项目，修改嵌套对象属性后视图没更新，可以手动调用detectChanges()触发变更检测。

额外提示 #

如果行里的属性名和列id的对应关系不是Col_${colId}，你需要根据实际的映射规则调整columnPropName的生成逻辑。比如如果列id直接就是属性名，那直接用colId即可。

内容的提问来源于stack exchange，提问作者Nimmi