fix(components): [tree] repeat trigger change event on the same node (#9645)

This commit is contained in:
zz 2022-09-06 12:18:12 +08:00 committed by GitHub
parent 6def14db3b
commit 390f5bd8ee
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 25 additions and 21 deletions

View File

@ -1,5 +1,6 @@
import type { SetupContext } from 'vue'
import type Node from './node'
import type { TreeKey, TreeNodeData } from '../tree.type'
import type { RootTreeType, TreeKey, TreeNodeData } from '../tree.type'
export const NODE_KEY = '$treeNodeId'
@ -17,3 +18,16 @@ export const getNodeKey = function (key: TreeKey, data: TreeNodeData): any {
if (!key) return data[NODE_KEY]
return data[key]
}
export const handleCurrentChange = (
store: RootTreeType['store'],
emit: SetupContext['emit'],
setCurrent: () => void
) => {
const preCurrentNode = store.value.currentNode
setCurrent()
const currentNode = store.value.currentNode
if (preCurrentNode === currentNode) return
emit('current-change', currentNode ? currentNode : null, currentNode)
}

View File

@ -100,7 +100,7 @@ import { CaretRight, Loading } from '@element-plus/icons-vue'
import { debugWarn } from '@element-plus/utils'
import { useNamespace } from '@element-plus/hooks'
import NodeContent from './tree-node-content.vue'
import { getNodeKey as getNodeKeyUtil } from './model/util'
import { getNodeKey as getNodeKeyUtil, handleCurrentChange } from './model/util'
import { useNodeExpandEventBroadcast } from './model/useNodeExpandEventBroadcast'
import { dragEventsKey } from './model/useDragNode'
import Node from './model/node'
@ -229,12 +229,8 @@ export default defineComponent({
}
const handleClick = (e: MouseEvent) => {
const store = tree.store.value
store.setCurrentNode(props.node)
tree.ctx.emit(
'current-change',
store.currentNode ? store.currentNode.data : null,
store.currentNode
handleCurrentChange(tree.store, tree.ctx.emit, () =>
tree.store.value.setCurrentNode(props.node)
)
tree.currentNode.value = props.node

View File

@ -47,7 +47,7 @@ import { iconPropType } from '@element-plus/utils'
import { useLocale, useNamespace } from '@element-plus/hooks'
import { formItemContextKey } from '@element-plus/tokens'
import TreeStore from './model/tree-store'
import { getNodeKey as getNodeKeyUtil } from './model/util'
import { getNodeKey as getNodeKeyUtil, handleCurrentChange } from './model/util'
import ElTreeNode from './tree-node.vue'
import { useNodeExpandEventBroadcast } from './model/useNodeExpandEventBroadcast'
import { useDragNodeHandler } from './model/useDragNode'
@ -318,24 +318,18 @@ export default defineComponent({
if (!props.nodeKey)
throw new Error('[Tree] nodeKey is required in setCurrentNode')
const preNode = store.value.currentNode
store.value.setUserCurrentNode(node, shouldAutoExpandParent)
const currNode = store.value.currentNode
if (preNode !== currNode) {
ctx.emit('current-change', currNode ? currNode.data : null, currNode)
}
handleCurrentChange(store, ctx.emit, () =>
store.value.setUserCurrentNode(node, shouldAutoExpandParent)
)
}
const setCurrentKey = (key: TreeKey, shouldAutoExpandParent = true) => {
if (!props.nodeKey)
throw new Error('[Tree] nodeKey is required in setCurrentKey')
const preNode = store.value.currentNode
store.value.setCurrentNodeKey(key, shouldAutoExpandParent)
const currNode = store.value.currentNode
if (preNode !== currNode) {
ctx.emit('current-change', currNode ? currNode.data : null, currNode)
}
handleCurrentChange(store, ctx.emit, () =>
store.value.setCurrentNodeKey(key, shouldAutoExpandParent)
)
}
const getNode = (data: TreeKey | TreeNodeData): Node => {