Vue.js 中使用 changeColumn(arr) 方法动态隐藏表格列

以下是一个实现 changeColumn 方法的示例代码：

function changeColumn(arr) {
  // 遍历 tableConfig，将所有的 hide 属性设置为 false
  tableConfig.forEach((column) => {
    column.hide = false;
  });

  // 第二次遍历，将 id 为 1，2，3 的 hide 属性设置为 true
  tableConfig.forEach((column) => {
    if (column.id >= 1 && column.id <= 3) {
      column.hide = true;
    }
  });

  // 第三次遍历，根据 arr 数组的值设置对应 id 的 hide 属性为 true
  arr.forEach((value) => {
    if (value === '1') {
      // arr 数组中包含 1，将 id 为 4-7 的 hide 属性设置为 true
      tableConfig.forEach((column) => {
        if (column.id >= 4 && column.id <= 7) {
          column.hide = true;
        }
      });
    } else if (value === '2') {
      // arr 数组中包含 2，将 id 为 8-10 的 hide 属性设置为 true
      tableConfig.forEach((column) => {
        if (column.id >= 8 && column.id <= 10) {
          column.hide = true;
        }
      });
    } else if (value === '3') {
      // arr 数组中包含 3，将 id 为 11-16 的 hide 属性设置为 true
      tableConfig.forEach((column) => {
        if (column.id >= 11 && column.id <= 16) {
          column.hide = true;
        }
      });
    } else if (value === '4') {
      // arr 数组中包含 4，将 id 为 17-24 的 hide 属性设置为 true
      tableConfig.forEach((column) => {
        if (column.id >= 17 && column.id <= 24) {
          column.hide = true;
        }
      });
    }
  });
}

请注意，上述代码中的 tableConfig 是一个包含列配置的数组，每个列配置对象都有一个 id 属性和一个 hide 属性。changeColumn 方法接收一个 arr 参数，该参数是一个包含字符串的数组。根据 arr 的值，将 tableConfig 中对应 id 的列的 hide 属性设置为 true。