Vue.js 使用 El-tree-select 组件实现部门选择功能，并过滤掉选中行的子级和自身

<el-form-item label='上级部门' prop='parentId' v-if='formData.parentId !== '0''> <el-tree-select ref='treeRef' v-model='formData.parentId' clearable :data='filteredDeptList' node-key='deptId' check-strictly :default-expanded-keys='[formData.parentId]' :default-checked-keys='[formData.parentId]' :props='{ label: 'deptName', value: 'deptId' }' :filter-node-method='filterNode' style='width: 450px' /> <el-tree-select ref='treeRef' v-model='formData.parentId' clearable :data='filteredDeptList' node-key='deptId' check-strictly :default-expanded-keys='[formData.parentId]' :default-checked-keys='[formData.parentId]' :props='{ label: 'deptName', value: 'deptId' }' :filter-node-method='filterNode' style='width: 450px' />

const filteredDeptList = computed(() => filterDeptList(formData.parentId));
const filterDeptList = (parentId: string) => {  // 进行部门列表的过滤操作，返回过滤后的列表  return deptList.value.filter((dept) => dept.deptId !== parentId && !dept.ancestors.includes(parentId));
};
const filterNode = (value: string, data) => {  if (!value) return true;  if (data.label && data.label.includes(value)) {    return true; // 显示包含搜索关键字的节点  }  if (data.ancestors && data.ancestors.includes(value)) {    return true;   }  return false;
}

需要注意的是：

1. 上级部门的下拉菜单使用了同样的代码，以便在不同情况下都能进行过滤操作。
2. filterDeptList 函数在过滤时需要检查部门的 ancestors 属性是否包含选中行的 parentId，以过滤掉自己的子级id。
3. filterNode 函数中，将搜索关键字赋值给 value，并且在过滤时判断节点的 ancestors 是否包含搜索关键字，以显示符合条件的节点。