vue数组对象递归循环删除指定值的数据

在Vue.js中，如果你有一个嵌套的对象数组，想要通过递归遍历并删除所有包含特定键值对的对象，你可以采用如下的方法：

首先，假设你有一个数据结构类似这样的数组：

let data = [
  {
    id: 1,
    name: 'Item 1',
    children: [
      {
        id: 2,
        name: 'Child 1',
        children: []
      },
      {
        id: 3,
        name: 'Child 2',
        children: [
          {
            id: 4,
            name: 'Grandchild 1',
            value: 'Target Value'
          }
        ]
      }
    ]
  }
];

你可以编写一个自定义的递归函数，用于查找并删除匹配条件的对象：

function removeValueRecursive(obj, targetKey, targetValue) {
  // 遍历当前对象的所有属性
  for (let key in obj) {
    if (obj.hasOwnProperty(key)) {
      // 如果找到目标键，并且其值等于目标值
      if (key === targetKey && obj[key] === targetValue) {
        // 删除该对象
        delete obj[key];

        // 如果对象有children，继续递归处理
        if (Array.isArray(obj.children)) {
          obj.children = obj.children.filter(child => child !== targetValue); // 或者直接删除整个children数组
          removeValueRecursive(obj.children, targetKey, targetValue);
        }
      } else if (typeof obj[key] === 'object') {
        // 如果是嵌套对象，递归处理
        removeValueRecursive(obj[key], targetKey, targetValue);
      }
    }
  }
}

// 使用函数删除数据中的目标值
removeValueRecursive(data, 'value', 'Target Value');

这样，`data`数组中的所有包含键为'value'且值为'Target Value'的对象及其子级都将被删除。