Fix:1.按住Ctrl键时禁用节点双击事件;2.优化节点激活事件的派发,激活节点未改变时不派发事件,短时间派发多次事件时跳过中间事件

This commit is contained in:
wanglin2 2023-11-28 17:37:44 +08:00
parent a0f56473ee
commit 70c32e3c74
4 changed files with 43 additions and 15 deletions

View File

@ -25,7 +25,8 @@ import {
setDataToClipboard,
getDataFromClipboard,
htmlEscape,
parseAddGeneralizationNodeList
parseAddGeneralizationNodeList,
checkNodeListIsEqual
} from '../../utils'
import { shapeList } from './node/Shape'
import { lineStyleProps } from '../../themes/default'
@ -87,6 +88,9 @@ class Render {
this.currentBeingPasteType = ''
// 节点高亮框
this.highlightBoxNode = null
// 上一次节点激活数据
this.lastActiveNode = null
this.lastActiveNodeList = []
// 布局
this.setLayout()
// 绑定事件
@ -335,6 +339,24 @@ class Render {
})
}
// 派发节点激活事件
emitNodeActiveEvent(node = null, activeNodeList = [...this.activeNodeList]) {
let isChange = false
isChange = this.lastActiveNode !== node
if (!isChange) {
isChange = !checkNodeListIsEqual(
this.lastActiveNodeList,
activeNodeList
)
}
if (!isChange) return
this.lastActiveNode = node
this.lastActiveNodeList = [...activeNodeList]
this.mindMap.batchExecution.push('emitNodeActiveEvent', () => {
this.mindMap.emit('node_active', node, activeNodeList)
})
}
// 鼠标点击画布时清空当前激活节点列表
clearActiveNodeListOnDrawClick(e, eventType) {
if (this.activeNodeList.length <= 0) return
@ -431,7 +453,7 @@ class Render {
return
}
this.clearActiveNodeList()
this.mindMap.emit('node_active', null, [])
this.emitNodeActiveEvent(null, [])
}
// 清除当前激活的节点列表
@ -1602,11 +1624,6 @@ class Render {
return res
}
// 派发节点激活改变事件
emitNodeActiveEvent() {
this.mindMap.emit('node_active', null, [...this.activeNodeList])
}
// 高亮节点或子节点
highlightNode(node, range) {
const { highlightNodeBoxStyle = {} } = this.mindMap.opt

View File

@ -442,9 +442,7 @@ class Node {
this.mindMap.renderer[
isActive ? 'removeNodeFromActiveList' : 'addNodeToActiveList'
](this)
this.mindMap.emit('node_active', isActive ? null : this, [
...this.mindMap.renderer.activeNodeList
])
this.renderer.emitNodeActiveEvent(isActive ? null : this)
}
this.mindMap.emit('node_mousedown', this, e)
})
@ -475,7 +473,7 @@ class Node {
})
// 双击事件
this.group.on('dblclick', e => {
if (this.mindMap.opt.readonly) {
if (this.mindMap.opt.readonly || e.ctrlKey) {
return
}
e.stopPropagation()
@ -521,7 +519,7 @@ class Node {
this.mindMap.emit('before_node_active', this, this.renderer.activeNodeList)
this.renderer.clearActiveNodeList()
this.renderer.addNodeToActiveList(this)
this.mindMap.emit('node_active', this, [...this.renderer.activeNodeList])
this.renderer.emitNodeActiveEvent(this)
}
// 更新节点

View File

@ -133,9 +133,7 @@ class Select {
}
}
if (isNumChange || isNodeChange) {
this.mindMap.emit('node_active', null, [
...this.mindMap.renderer.activeNodeList
])
this.mindMap.renderer.emitNodeActiveEvent()
}
}

View File

@ -1003,3 +1003,18 @@ export const handleSelfCloseTags = str => {
})
return str
}
// 检查两个节点列表是否包含的节点是一样的
export const checkNodeListIsEqual = (list1, list2) => {
if (list1.length !== list2.length) return false
for (let i = 0; i < list1.length; i++) {
if (
!list2.find(item => {
return item.uid === list1[i].uid
})
) {
return false
}
}
return true
}