提交 f707541d 编写于 作者: 无木

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

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