From 2d50106ce7ab8d72d7a6bdaf10ba1b472293ddf3 Mon Sep 17 00:00:00 2001 From: wanglin2 <1013335014@qq.com> Date: Wed, 29 Nov 2023 08:50:13 +0800 Subject: [PATCH] =?UTF-8?q?Feat=EF=BC=9A=E6=96=B0=E5=A2=9E=E5=88=9B?= =?UTF-8?q?=E5=BB=BA=E6=96=B0=E8=8A=82=E7=82=B9=E6=97=B6=E9=BB=98=E8=AE=A4?= =?UTF-8?q?=E4=B8=8D=E8=81=9A=E7=84=A6=E6=96=B0=E8=8A=82=E7=82=B9=E7=9A=84?= =?UTF-8?q?=E9=85=8D=E7=BD=AE=E9=80=89=E9=A1=B9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../src/constants/defaultOptions.js | 4 +- simple-mind-map/src/core/render/Render.js | 60 ++++++++++++------- 2 files changed, 43 insertions(+), 21 deletions(-) diff --git a/simple-mind-map/src/constants/defaultOptions.js b/simple-mind-map/src/constants/defaultOptions.js index 298343fb..ac0814c2 100644 --- a/simple-mind-map/src/constants/defaultOptions.js +++ b/simple-mind-map/src/constants/defaultOptions.js @@ -229,5 +229,7 @@ export const defaultOpt = { highlightNodeBoxStyle: { stroke: 'rgb(94, 200, 248)', fill: 'transparent' - } + }, + // 创建新节点时默认不聚焦新节点，不进入新节点的编辑状态 + notFocusNewNodeOnCreateNewNode: false } diff --git a/simple-mind-map/src/core/render/Render.js b/simple-mind-map/src/core/render/Render.js index ad073d8b..9ebbf368 100644 --- a/simple-mind-map/src/core/render/Render.js +++ b/simple-mind-map/src/core/render/Render.js @@ -344,10 +344,7 @@ class Render { let isChange = false isChange = this.lastActiveNode !== node if (!isChange) { - isChange = !checkNodeListIsEqual( - this.lastActiveNodeList, - activeNodeList - ) + isChange = !checkNodeListIsEqual(this.lastActiveNodeList, activeNodeList) } if (!isChange) return this.lastActiveNode = node @@ -541,16 +538,20 @@ class Render { this.textEdit.hideEditTextBox() const { defaultInsertSecondLevelNodeText, - defaultInsertBelowSecondLevelNodeText + defaultInsertBelowSecondLevelNodeText, + notFocusNewNodeOnCreateNewNode } = this.mindMap.opt const list = appointNodes.length > 0 ? appointNodes : this.activeNodeList const handleMultiNodes = list.length > 1 const isRichText = !!this.mindMap.richText + const focusNewNode = notFocusNewNodeOnCreateNewNode + ? false + : handleMultiNodes || !openEdit const params = { expand: true, richText: isRichText, resetRichText: isRichText, - isActive: handleMultiNodes || !openEdit // 如果同时对多个节点插入子节点，那么需要把新增的节点设为激活状态。如果不进入编辑状态，那么也需要手动设为激活状态 + isActive: focusNewNode // 如果同时对多个节点插入子节点，那么需要把新增的节点设为激活状态。如果不进入编辑状态，那么也需要手动设为激活状态 } // 动态指定的子节点数据也需要添加相关属性 appointChildren = addDataToAppointNodes(appointChildren, { @@ -569,7 +570,8 @@ class Render { // 计算插入位置 const index = getNodeDataIndex(node) const newNodeData = { - inserting: handleMultiNodes ? false : openEdit, // 如果同时对多个节点插入子节点，那么无需进入编辑模式, + inserting: + notFocusNewNodeOnCreateNewNode || handleMultiNodes ? false : openEdit, // 如果同时对多个节点插入子节点，那么无需进入编辑模式, data: { text: text, ...params, @@ -581,7 +583,7 @@ class Render { parent.nodeData.children.splice(index + 1, 0, newNodeData) }) // 如果同时对多个节点插入子节点，需要清除原来激活的节点 - if (handleMultiNodes || !openEdit) { + if (focusNewNode) { this.clearActiveNodeList() } this.mindMap.render() @@ -597,11 +599,13 @@ class Render { this.textEdit.hideEditTextBox() const list = appointNodes.length > 0 ? appointNodes : this.activeNodeList const isRichText = !!this.mindMap.richText + const { notFocusNewNodeOnCreateNewNode } = this.mindMap.opt + const focusNewNode = !notFocusNewNodeOnCreateNewNode const params = { expand: true, richText: isRichText, resetRichText: isRichText, - isActive: true + isActive: focusNewNode } nodeList = addDataToAppointNodes(nodeList, params) list.forEach(node => { @@ -617,7 +621,9 @@ class Render { ) parent.nodeData.children.splice(index + 1, 0, ...newNodeList) }) - this.clearActiveNodeList() + if (focusNewNode) { + this.clearActiveNodeList() + } this.mindMap.render() } @@ -635,16 +641,20 @@ class Render { this.textEdit.hideEditTextBox() const { defaultInsertSecondLevelNodeText, - defaultInsertBelowSecondLevelNodeText + defaultInsertBelowSecondLevelNodeText, + notFocusNewNodeOnCreateNewNode } = this.mindMap.opt const list = appointNodes.length > 0 ? appointNodes : this.activeNodeList const handleMultiNodes = list.length > 1 const isRichText = !!this.mindMap.richText + const focusNewNode = notFocusNewNodeOnCreateNewNode + ? false + : handleMultiNodes || !openEdit const params = { expand: true, richText: isRichText, resetRichText: isRichText, - isActive: handleMultiNodes || !openEdit // 如果同时对多个节点插入子节点，那么需要把新增的节点设为激活状态。如果不进入编辑状态，那么也需要手动设为激活状态 + isActive: focusNewNode // 如果同时对多个节点插入子节点，那么需要把新增的节点设为激活状态。如果不进入编辑状态，那么也需要手动设为激活状态 } // 动态指定的子节点数据也需要添加相关属性 appointChildren = addDataToAppointNodes(appointChildren, { @@ -661,7 +671,8 @@ class Render { ? defaultInsertSecondLevelNodeText : defaultInsertBelowSecondLevelNodeText const newNode = { - inserting: handleMultiNodes ? false : openEdit, // 如果同时对多个节点插入子节点，那么无需进入编辑模式 + inserting: + notFocusNewNodeOnCreateNewNode || handleMultiNodes ? false : openEdit, // 如果同时对多个节点插入子节点，那么无需进入编辑模式 data: { text: text, uid: createUid(), @@ -677,7 +688,7 @@ class Render { }) }) // 如果同时对多个节点插入子节点，需要清除原来激活的节点 - if (handleMultiNodes || !openEdit) { + if (focusNewNode) { this.clearActiveNodeList() } this.mindMap.render() @@ -693,11 +704,13 @@ class Render { this.textEdit.hideEditTextBox() const list = appointNodes.length > 0 ? appointNodes : this.activeNodeList const isRichText = !!this.mindMap.richText + const { notFocusNewNodeOnCreateNewNode } = this.mindMap.opt + const focusNewNode = !notFocusNewNodeOnCreateNewNode const params = { expand: true, richText: isRichText, resetRichText: isRichText, - isActive: true + isActive: focusNewNode } childList = addDataToAppointNodes(childList, params) list.forEach(node => { @@ -714,7 +727,9 @@ class Render { expand: true }) }) - this.clearActiveNodeList() + if (focusNewNode) { + this.clearActiveNodeList() + } this.mindMap.render() } @@ -727,16 +742,20 @@ class Render { this.textEdit.hideEditTextBox() const { defaultInsertSecondLevelNodeText, - defaultInsertBelowSecondLevelNodeText + defaultInsertBelowSecondLevelNodeText, + notFocusNewNodeOnCreateNewNode } = this.mindMap.opt const list = appointNodes.length > 0 ? appointNodes : this.activeNodeList const handleMultiNodes = list.length > 1 const isRichText = !!this.mindMap.richText + const focusNewNode = notFocusNewNodeOnCreateNewNode + ? false + : handleMultiNodes || !openEdit const params = { expand: true, richText: isRichText, resetRichText: isRichText, - isActive: handleMultiNodes || !openEdit // 如果同时对多个节点插入子节点，那么需要把新增的节点设为激活状态。如果不进入编辑状态，那么也需要手动设为激活状态 + isActive: focusNewNode // 如果同时对多个节点插入子节点，那么需要把新增的节点设为激活状态。如果不进入编辑状态，那么也需要手动设为激活状态 } list.forEach(node => { if (node.isGeneralization || node.isRoot) { @@ -747,7 +766,8 @@ class Render { ? defaultInsertSecondLevelNodeText : defaultInsertBelowSecondLevelNodeText const newNode = { - inserting: handleMultiNodes ? false : openEdit, // 如果同时对多个节点插入子节点，那么无需进入编辑模式 + inserting: + notFocusNewNodeOnCreateNewNode || handleMultiNodes ? false : openEdit, // 如果同时对多个节点插入子节点，那么无需进入编辑模式 data: { text: text, uid: createUid(), @@ -762,7 +782,7 @@ class Render { parent.nodeData.children.splice(index, 1, newNode) }) // 如果同时对多个节点插入子节点，需要清除原来激活的节点 - if (handleMultiNodes || !openEdit) { + if (focusNewNode) { this.clearActiveNodeList() } this.mindMap.render()