fix: 节点树在编辑 & 空数组(不勾选)情况 勾选节点会造成watch延迟触发 导致会带上父节点id造成id重

This commit is contained in:
dap 2024-11-29 15:01:26 +08:00
parent 07325d4c5e
commit 36939f36ee
2 changed files with 15 additions and 2 deletions

View File

@ -1,3 +1,9 @@
# 1.1.3
**Bug Fixes**
- 节点树在编辑 & 空数组(不勾选)情况 勾选节点会造成watch延迟触发 导致会带上父节点id造成id重复
# 1.1.2 # 1.1.2
**Features** **Features**

View File

@ -8,6 +8,7 @@ import { computed, nextTick, onMounted, type PropType, ref, watch } from 'vue';
import { findGroupParentIds, treeToList } from '@vben/utils'; import { findGroupParentIds, treeToList } from '@vben/utils';
import { Checkbox, Tree } from 'ant-design-vue'; import { Checkbox, Tree } from 'ant-design-vue';
import { uniq } from 'lodash-es';
/** 需要禁止透传 */ /** 需要禁止透传 */
defineOptions({ inheritAttrs: false }); defineOptions({ inheritAttrs: false });
@ -73,6 +74,8 @@ const checkedRealKeys = ref<(number | string)[]>([]);
/** /**
* 取第一次的menuTree id 设置到checkedMenuKeys * 取第一次的menuTree id 设置到checkedMenuKeys
* 主要为了解决没有任何修改 直接点击保存的情况 * 主要为了解决没有任何修改 直接点击保存的情况
*
* length为0情况(即新增时候没有勾选节点) 勾选这里会延迟触发 节点会拼接上父节点 导致ID重复
*/ */
const stop = watch([checkedKeys, () => props.treeData], () => { const stop = watch([checkedKeys, () => props.treeData], () => {
if ( if (
@ -86,7 +89,10 @@ const stop = watch([checkedKeys, () => props.treeData], () => {
checkedKeys.value as any, checkedKeys.value as any,
{ id: props.fieldNames.key }, { id: props.fieldNames.key },
); );
checkedRealKeys.value = [...parentIds, ...checkedKeys.value]; /**
* uniq 解决上面的id重复问题
*/
checkedRealKeys.value = uniq([...parentIds, ...checkedKeys.value]);
stop(); stop();
} }
if (!props.checkStrictly && checkedKeys.value.length > 0) { if (!props.checkStrictly && checkedKeys.value.length > 0) {
@ -137,9 +143,10 @@ function handleCheckStrictlyChange(e: CheckboxChangeEvent) {
/** /**
* 暴露方法来获取用于提交的全部节点 * 暴露方法来获取用于提交的全部节点
* uniq去重(保险方案)
*/ */
defineExpose({ defineExpose({
getCheckedKeys: () => checkedRealKeys.value, getCheckedKeys: () => uniq(checkedRealKeys.value),
}); });
onMounted(async () => { onMounted(async () => {