提交 f707541d 编写于 作者: 无木

fix(tree): fixed `checkedKeys` with `search` mode

修复搜索状态的切换导致的勾选值可能不正确的问题
上级 b06a7ab7
......@@ -18,8 +18,8 @@
import TreeHeader from './TreeHeader.vue';
import { ScrollContainer } from '/@/components/Container';
import { omit, get, cloneDeep, concat, uniq } from 'lodash-es';
import { isBoolean, isFunction } from '/@/utils/is';
import { omit, get, difference } from 'lodash-es';
import { isArray, isBoolean, isFunction } from '/@/utils/is';
import { extendSlots, getSlot } from '/@/utils/helper/tsxHelper';
import { filter } from '/@/utils/helper/treeHelper';
......@@ -56,25 +56,6 @@
searchData: [] as TreeItem[],
});
const copyState = {
checkedKeys: [],
};
watch(
() => searchState.startSearch,
(newVal, oldVal) => {
if (newVal && !oldVal) {
// before search, save current checkedKeys
copyState.checkedKeys = cloneDeep(state.checkedKeys);
} else if (!newVal && oldVal) {
// after search, restore checkedKeys
state.checkedKeys = uniq(concat(state.checkedKeys, copyState.checkedKeys));
copyState.checkedKeys = [];
}
},
{ immediate: true }
);
const treeDataRef = ref<TreeItem[]>([]);
const [createContextMenu] = useContextMenu();
......@@ -109,8 +90,19 @@
emit('update:selectedKeys', v);
},
onCheck: (v: CheckKeys, e: CheckEvent) => {
state.checkedKeys = v;
const rawVal = toRaw(v);
let currentValue = toRaw(state.checkedKeys) as Keys;
if (isArray(currentValue) && searchState.startSearch) {
const { key } = unref(getReplaceFields);
currentValue = difference(currentValue, getChildrenKeys(e.node.$attrs.node[key]));
if (e.checked) {
currentValue.push(e.node.$attrs.node[key]);
}
state.checkedKeys = currentValue;
} else {
state.checkedKeys = v;
}
const rawVal = toRaw(state.checkedKeys);
emit('update:value', rawVal);
emit('check', rawVal, e);
},
......@@ -134,6 +126,7 @@
filterByLevel,
updateNodeByKey,
getAllKeys,
getChildrenKeys,
} = useTree(treeDataRef, getReplaceFields);
function getIcon(params: Recordable, icon?: string) {
......
......@@ -27,6 +27,28 @@ export function useTree(
return keys as Keys;
}
function getChildrenKeys(nodeKey: string | number, list?: TreeDataItem[]): Keys {
const keys: Keys = [];
const treeData = list || unref(treeDataRef);
const { key: keyField, children: childrenField } = unref(getReplaceFields);
if (!childrenField || !keyField) return keys;
for (let index = 0; index < treeData.length; index++) {
const node = treeData[index];
const children = node[childrenField];
if (nodeKey === node[keyField]) {
keys.push(node[keyField]!);
if (children && children.length) {
keys.push(...(getAllKeys(children) as string[]));
}
} else {
if (children && children.length) {
keys.push(...getChildrenKeys(nodeKey, children));
}
}
}
return keys as Keys;
}
// Update node
function updateNodeByKey(key: string, node: TreeDataItem, list?: TreeDataItem[]) {
if (!key) return;
......@@ -146,5 +168,6 @@ export function useTree(
filterByLevel,
updateNodeByKey,
getAllKeys,
getChildrenKeys,
};
}
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册