Fix:修复底边风格的情况下,节点高度过高会和其他节点重叠的问题

This commit is contained in:
wanglin2 2023-02-20 15:10:27 +08:00
parent 7e11fde892
commit c8b50908e1
8 changed files with 307 additions and 286 deletions

View File

@ -1 +1 @@
<!DOCTYPE html><html lang=""><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width,initial-scale=1"><link rel="icon" href="./dist/logo.png"><title>一个简单的web思维导图实现</title><link href="dist/js/chunk-2d0a3179.f79d6590.js" rel="prefetch"><link href="dist/js/chunk-2d0aa579.d901cc5e.js" rel="prefetch"><link href="dist/js/chunk-2d0aa978.ae72a285.js" rel="prefetch"><link href="dist/js/chunk-2d0ab10b.13ffd981.js" rel="prefetch"><link href="dist/js/chunk-2d0abe0f.f7178a38.js" rel="prefetch"><link href="dist/js/chunk-2d0b361e.64d433a0.js" rel="prefetch"><link href="dist/js/chunk-2d0b91e5.de98db92.js" rel="prefetch"><link href="dist/js/chunk-2d0b92c3.a48a667e.js" rel="prefetch"><link href="dist/js/chunk-2d0bd54e.e56450f0.js" rel="prefetch"><link href="dist/js/chunk-2d0be174.1531a230.js" rel="prefetch"><link href="dist/js/chunk-2d0c0a44.d2768274.js" rel="prefetch"><link href="dist/js/chunk-2d0c14fc.a89a80b4.js" rel="prefetch"><link href="dist/js/chunk-2d0c18d8.4dad4846.js" rel="prefetch"><link href="dist/js/chunk-2d0c191e.6fb13561.js" rel="prefetch"><link href="dist/js/chunk-2d0c1a01.49c23f9e.js" rel="prefetch"><link href="dist/js/chunk-2d0d9fbc.adce6374.js" rel="prefetch"><link href="dist/js/chunk-2d0da701.2e0766e2.js" rel="prefetch"><link href="dist/js/chunk-2d0dad5f.ec79eebe.js" rel="prefetch"><link href="dist/js/chunk-2d0db0f2.19efc7d4.js" rel="prefetch"><link href="dist/js/chunk-2d0dddce.6a579f6f.js" rel="prefetch"><link href="dist/js/chunk-2d0ddf37.d162efb9.js" rel="prefetch"><link href="dist/js/chunk-2d0de01b.21eae2e6.js" rel="prefetch"><link href="dist/js/chunk-2d0e2326.f3a9c7fc.js" rel="prefetch"><link href="dist/js/chunk-2d0e268c.2255a1cb.js" rel="prefetch"><link href="dist/js/chunk-2d0e5089.2b202405.js" rel="prefetch"><link href="dist/js/chunk-2d0e9742.a2d22497.js" rel="prefetch"><link href="dist/js/chunk-2d0f026c.46ed3069.js" rel="prefetch"><link href="dist/js/chunk-2d2082b9.fe227afb.js" rel="prefetch"><link href="dist/js/chunk-2d208ffa.3ac1a852.js" rel="prefetch"><link href="dist/js/chunk-2d20ec02.917aff76.js" rel="prefetch"><link href="dist/js/chunk-2d20f68f.acd7e356.js" rel="prefetch"><link href="dist/js/chunk-2d210a7a.5a4025ce.js" rel="prefetch"><link href="dist/js/chunk-2d216004.905379d5.js" rel="prefetch"><link href="dist/js/chunk-2d216b67.2d06497a.js" rel="prefetch"><link href="dist/js/chunk-2d217907.cc6917a4.js" rel="prefetch"><link href="dist/js/chunk-2d226d0a.3703455b.js" rel="prefetch"><link href="dist/js/chunk-2d2299c3.ffd15e65.js" rel="prefetch"><link href="dist/js/chunk-2d22bd06.cace3b1b.js" rel="prefetch"><link href="dist/js/chunk-2d2308b0.fb49d06b.js" rel="prefetch"><link href="dist/js/chunk-2d238428.266d8f0c.js" rel="prefetch"><link href="dist/js/chunk-3a2f3e67.13278516.js" rel="prefetch"><link href="dist/css/app.8a532989.css" rel="preload" as="style"><link href="dist/css/chunk-vendors.1790fe42.css" rel="preload" as="style"><link href="dist/js/app.0119fad7.js" rel="preload" as="script"><link href="dist/js/chunk-vendors.7f3b8358.js" rel="preload" as="script"><link href="dist/css/chunk-vendors.1790fe42.css" rel="stylesheet"><link href="dist/css/app.8a532989.css" rel="stylesheet"></head><body><noscript><strong>We're sorry but thoughts doesn't work properly without JavaScript enabled. Please enable it to continue.</strong></noscript><div id="app"></div><script src="dist/js/chunk-vendors.7f3b8358.js"></script><script src="dist/js/app.0119fad7.js"></script></body></html> <!DOCTYPE html><html lang=""><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width,initial-scale=1"><link rel="icon" href="./dist/logo.png"><title>一个简单的web思维导图实现</title><link href="dist/js/chunk-2d0a3179.f79d6590.js" rel="prefetch"><link href="dist/js/chunk-2d0aa579.d901cc5e.js" rel="prefetch"><link href="dist/js/chunk-2d0aa978.ae72a285.js" rel="prefetch"><link href="dist/js/chunk-2d0ab10b.13ffd981.js" rel="prefetch"><link href="dist/js/chunk-2d0abe0f.f7178a38.js" rel="prefetch"><link href="dist/js/chunk-2d0b361e.64d433a0.js" rel="prefetch"><link href="dist/js/chunk-2d0b91e5.de98db92.js" rel="prefetch"><link href="dist/js/chunk-2d0b92c3.a48a667e.js" rel="prefetch"><link href="dist/js/chunk-2d0bd54e.e56450f0.js" rel="prefetch"><link href="dist/js/chunk-2d0be174.1531a230.js" rel="prefetch"><link href="dist/js/chunk-2d0c0a44.d2768274.js" rel="prefetch"><link href="dist/js/chunk-2d0c14fc.a89a80b4.js" rel="prefetch"><link href="dist/js/chunk-2d0c18d8.4dad4846.js" rel="prefetch"><link href="dist/js/chunk-2d0c191e.6fb13561.js" rel="prefetch"><link href="dist/js/chunk-2d0c1a01.49c23f9e.js" rel="prefetch"><link href="dist/js/chunk-2d0d9fbc.adce6374.js" rel="prefetch"><link href="dist/js/chunk-2d0da701.2e0766e2.js" rel="prefetch"><link href="dist/js/chunk-2d0dad5f.ec79eebe.js" rel="prefetch"><link href="dist/js/chunk-2d0db0f2.19efc7d4.js" rel="prefetch"><link href="dist/js/chunk-2d0dddce.6a579f6f.js" rel="prefetch"><link href="dist/js/chunk-2d0ddf37.d162efb9.js" rel="prefetch"><link href="dist/js/chunk-2d0de01b.21eae2e6.js" rel="prefetch"><link href="dist/js/chunk-2d0e2326.f3a9c7fc.js" rel="prefetch"><link href="dist/js/chunk-2d0e268c.2255a1cb.js" rel="prefetch"><link href="dist/js/chunk-2d0e5089.2b202405.js" rel="prefetch"><link href="dist/js/chunk-2d0e9742.a2d22497.js" rel="prefetch"><link href="dist/js/chunk-2d0f026c.46ed3069.js" rel="prefetch"><link href="dist/js/chunk-2d2082b9.fe227afb.js" rel="prefetch"><link href="dist/js/chunk-2d208ffa.3ac1a852.js" rel="prefetch"><link href="dist/js/chunk-2d20ec02.917aff76.js" rel="prefetch"><link href="dist/js/chunk-2d20f68f.acd7e356.js" rel="prefetch"><link href="dist/js/chunk-2d210a7a.5a4025ce.js" rel="prefetch"><link href="dist/js/chunk-2d216004.905379d5.js" rel="prefetch"><link href="dist/js/chunk-2d216b67.2d06497a.js" rel="prefetch"><link href="dist/js/chunk-2d217907.cc6917a4.js" rel="prefetch"><link href="dist/js/chunk-2d226d0a.3703455b.js" rel="prefetch"><link href="dist/js/chunk-2d2299c3.ffd15e65.js" rel="prefetch"><link href="dist/js/chunk-2d22bd06.cace3b1b.js" rel="prefetch"><link href="dist/js/chunk-2d2308b0.fb49d06b.js" rel="prefetch"><link href="dist/js/chunk-2d238428.266d8f0c.js" rel="prefetch"><link href="dist/js/chunk-3a2f3e67.13278516.js" rel="prefetch"><link href="dist/css/app.8a532989.css" rel="preload" as="style"><link href="dist/css/chunk-vendors.1790fe42.css" rel="preload" as="style"><link href="dist/js/app.1bd65e51.js" rel="preload" as="script"><link href="dist/js/chunk-vendors.7f3b8358.js" rel="preload" as="script"><link href="dist/css/chunk-vendors.1790fe42.css" rel="stylesheet"><link href="dist/css/app.8a532989.css" rel="stylesheet"></head><body><noscript><strong>We're sorry but thoughts doesn't work properly without JavaScript enabled. Please enable it to continue.</strong></noscript><div id="app"></div><script src="dist/js/chunk-vendors.7f3b8358.js"></script><script src="dist/js/app.1bd65e51.js"></script></body></html>

View File

@ -707,27 +707,17 @@ class Node {
} }
this.renderGeneralization() this.renderGeneralization()
let t = this.group.transform() let t = this.group.transform()
// 节点使用横线风格,有两种结构需要调整节点的位置
let nodeUseLineStyleOffset = 0
if (
['logicalStructure', 'mindMap'].includes(this.mindMap.opt.layout) &&
!this.isRoot &&
!this.isGeneralization &&
this.themeConfig.nodeUseLineStyle
) {
nodeUseLineStyleOffset = this.height / 2
}
if (!layout) { if (!layout) {
this.group this.group
.animate(300) .animate(300)
.translate( .translate(
this.left - t.translateX, this.left - t.translateX,
this.top - t.translateY - nodeUseLineStyleOffset this.top - t.translateY
) )
} else { } else {
this.group.translate( this.group.translate(
this.left - t.translateX, this.left - t.translateX,
this.top - t.translateY - nodeUseLineStyleOffset this.top - t.translateY
) )
} }
} }

View File

@ -2,13 +2,16 @@ import Base from './Base'
import { walk, asyncRun } from '../utils' import { walk, asyncRun } from '../utils'
// 逻辑结构图 // 逻辑结构图
class LogicalStructure extends Base { class LogicalStructure extends Base {
// 构造函数 // 构造函数
constructor(opt = {}) { constructor(opt = {}) {
super(opt) super(opt)
} }
// 布局 // 布局
doLayout(callback) { doLayout(callback) {
let task = [ let task = [
() => { () => {
@ -28,6 +31,7 @@ class LogicalStructure extends Base {
} }
// 遍历数据计算节点的left、width、height // 遍历数据计算节点的left、width、height
computedBaseValue() { computedBaseValue() {
walk( walk(
this.renderer.renderTree, this.renderer.renderTree,
@ -63,6 +67,7 @@ class LogicalStructure extends Base {
} }
// 遍历节点树计算节点的top // 遍历节点树计算节点的top
computedTopValue() { computedTopValue() {
walk( walk(
this.root, this.root,
@ -89,6 +94,7 @@ class LogicalStructure extends Base {
} }
// 调整节点top // 调整节点top
adjustTopValue() { adjustTopValue() {
walk( walk(
this.root, this.root,
@ -112,6 +118,7 @@ class LogicalStructure extends Base {
} }
// 更新兄弟节点的top // 更新兄弟节点的top
updateBrothers(node, addHeight) { updateBrothers(node, addHeight) {
if (node.parent) { if (node.parent) {
let childrenList = node.parent.children let childrenList = node.parent.children
@ -143,6 +150,7 @@ class LogicalStructure extends Base {
} }
// 绘制连线,连接该节点到其子节点 // 绘制连线,连接该节点到其子节点
renderLine(node, lines, style, lineStyle) { renderLine(node, lines, style, lineStyle) {
if (lineStyle === 'curve') { if (lineStyle === 'curve') {
this.renderLineCurve(node, lines, style) this.renderLineCurve(node, lines, style)
@ -154,6 +162,7 @@ class LogicalStructure extends Base {
} }
// 直线风格连线 // 直线风格连线
renderLineStraight(node, lines, style) { renderLineStraight(node, lines, style) {
if (node.children.length <= 0) { if (node.children.length <= 0) {
return [] return []
@ -161,6 +170,7 @@ class LogicalStructure extends Base {
let { left, top, width, height, expandBtnSize } = node let { left, top, width, height, expandBtnSize } = node
let marginX = this.getMarginX(node.layerIndex + 1) let marginX = this.getMarginX(node.layerIndex + 1)
let s1 = (marginX - expandBtnSize) * 0.6 let s1 = (marginX - expandBtnSize) * 0.6
let nodeUseLineStyle = this.mindMap.themeConfig.nodeUseLineStyle
node.children.forEach((item, index) => { node.children.forEach((item, index) => {
let x1 = let x1 =
node.layerIndex === 0 ? left + width : left + width + expandBtnSize node.layerIndex === 0 ? left + width : left + width + expandBtnSize
@ -168,9 +178,11 @@ class LogicalStructure extends Base {
let x2 = item.left let x2 = item.left
let y2 = item.top + item.height / 2 let y2 = item.top + item.height / 2
// 节点使用横线风格,需要额外渲染横线 // 节点使用横线风格,需要额外渲染横线
let nodeUseLineStyleOffset = this.mindMap.themeConfig.nodeUseLineStyle let nodeUseLineStyleOffset = nodeUseLineStyle
? item.width ? item.width
: 0 : 0
y1 = nodeUseLineStyle && !node.isRoot ? y1 + height / 2 : y1
y2 = nodeUseLineStyle ? y2 + item.height / 2 : y2
let path = `M ${x1},${y1} L ${x1 + s1},${y1} L ${x1 + s1},${y2} L ${ let path = `M ${x1},${y1} L ${x1 + s1},${y1} L ${x1 + s1},${y2} L ${
x2 + nodeUseLineStyleOffset x2 + nodeUseLineStyleOffset
},${y2}` },${y2}`
@ -180,19 +192,23 @@ class LogicalStructure extends Base {
} }
// 直连风格 // 直连风格
renderLineDirect(node, lines, style) { renderLineDirect(node, lines, style) {
if (node.children.length <= 0) { if (node.children.length <= 0) {
return [] return []
} }
let { left, top, width, height, expandBtnSize } = node let { left, top, width, height, expandBtnSize } = node
let nodeUseLineStyle = this.mindMap.themeConfig.nodeUseLineStyle
node.children.forEach((item, index) => { node.children.forEach((item, index) => {
let x1 = let x1 =
node.layerIndex === 0 ? left + width / 2 : left + width + expandBtnSize node.layerIndex === 0 ? left + width / 2 : left + width + expandBtnSize
let y1 = top + height / 2 let y1 = top + height / 2
let x2 = item.left let x2 = item.left
let y2 = item.top + item.height / 2 let y2 = item.top + item.height / 2
y1 = nodeUseLineStyle && !node.isRoot ? y1 + height / 2 : y1
y2 = nodeUseLineStyle ? y2 + item.height / 2 : y2
// 节点使用横线风格,需要额外渲染横线 // 节点使用横线风格,需要额外渲染横线
let nodeUseLineStylePath = this.mindMap.themeConfig.nodeUseLineStyle let nodeUseLineStylePath = nodeUseLineStyle
? ` L ${item.left + item.width},${y2}` ? ` L ${item.left + item.width},${y2}`
: '' : ''
let path = `M ${x1},${y1} L ${x2},${y2}` + nodeUseLineStylePath let path = `M ${x1},${y1} L ${x2},${y2}` + nodeUseLineStylePath
@ -202,11 +218,13 @@ class LogicalStructure extends Base {
} }
// 曲线风格连线 // 曲线风格连线
renderLineCurve(node, lines, style) { renderLineCurve(node, lines, style) {
if (node.children.length <= 0) { if (node.children.length <= 0) {
return [] return []
} }
let { left, top, width, height, expandBtnSize } = node let { left, top, width, height, expandBtnSize } = node
let nodeUseLineStyle = this.mindMap.themeConfig.nodeUseLineStyle
node.children.forEach((item, index) => { node.children.forEach((item, index) => {
let x1 = let x1 =
node.layerIndex === 0 ? left + width / 2 : left + width + expandBtnSize node.layerIndex === 0 ? left + width / 2 : left + width + expandBtnSize
@ -214,8 +232,10 @@ class LogicalStructure extends Base {
let x2 = item.left let x2 = item.left
let y2 = item.top + item.height / 2 let y2 = item.top + item.height / 2
let path = '' let path = ''
y1 = nodeUseLineStyle && !node.isRoot ? y1 + height / 2 : y1
y2 = nodeUseLineStyle ? y2 + item.height / 2 : y2
// 节点使用横线风格,需要额外渲染横线 // 节点使用横线风格,需要额外渲染横线
let nodeUseLineStylePath = this.mindMap.themeConfig.nodeUseLineStyle let nodeUseLineStylePath = nodeUseLineStyle
? ` L ${item.left + item.width},${y2}` ? ` L ${item.left + item.width},${y2}`
: '' : ''
if (node.isRoot) { if (node.isRoot) {
@ -229,6 +249,7 @@ class LogicalStructure extends Base {
} }
// 渲染按钮 // 渲染按钮
renderExpandBtn(node, btn) { renderExpandBtn(node, btn) {
let { width, height } = node let { width, height } = node
let { translateX, translateY } = btn.transform() let { translateX, translateY } = btn.transform()
@ -243,6 +264,7 @@ class LogicalStructure extends Base {
} }
// 创建概要节点 // 创建概要节点
renderGeneralization(node, gLine, gNode) { renderGeneralization(node, gLine, gNode) {
let { let {
top, top,

View File

@ -208,11 +208,12 @@ class MindMap extends Base {
let { left, top, width, height, expandBtnSize } = node let { left, top, width, height, expandBtnSize } = node
let marginX = this.getMarginX(node.layerIndex + 1) let marginX = this.getMarginX(node.layerIndex + 1)
let s1 = (marginX - expandBtnSize) * 0.6 let s1 = (marginX - expandBtnSize) * 0.6
let nodeUseLineStyle = this.mindMap.themeConfig.nodeUseLineStyle
node.children.forEach((item, index) => { node.children.forEach((item, index) => {
let x1 = 0 let x1 = 0
let _s = 0 let _s = 0
// 节点使用横线风格,需要额外渲染横线 // 节点使用横线风格,需要额外渲染横线
let nodeUseLineStyleOffset = this.mindMap.themeConfig.nodeUseLineStyle let nodeUseLineStyleOffset = nodeUseLineStyle
? item.width ? item.width
: 0 : 0
if (item.dir === 'left') { if (item.dir === 'left') {
@ -226,6 +227,8 @@ class MindMap extends Base {
let y1 = top + height / 2 let y1 = top + height / 2
let x2 = item.dir === 'left' ? item.left + item.width : item.left let x2 = item.dir === 'left' ? item.left + item.width : item.left
let y2 = item.top + item.height / 2 let y2 = item.top + item.height / 2
y1 = nodeUseLineStyle && !node.isRoot ? y1 + height / 2 : y1
y2 = nodeUseLineStyle ? y2 + item.height / 2 : y2
let path = `M ${x1},${y1} L ${x1 + _s},${y1} L ${x1 + _s},${y2} L ${ let path = `M ${x1},${y1} L ${x1 + _s},${y1} L ${x1 + _s},${y2} L ${
x2 + nodeUseLineStyleOffset x2 + nodeUseLineStyleOffset
},${y2}` },${y2}`
@ -241,6 +244,7 @@ class MindMap extends Base {
return [] return []
} }
let { left, top, width, height, expandBtnSize } = node let { left, top, width, height, expandBtnSize } = node
let nodeUseLineStyle = this.mindMap.themeConfig.nodeUseLineStyle
node.children.forEach((item, index) => { node.children.forEach((item, index) => {
let x1 = let x1 =
node.layerIndex === 0 node.layerIndex === 0
@ -251,9 +255,11 @@ class MindMap extends Base {
let y1 = top + height / 2 let y1 = top + height / 2
let x2 = item.dir === 'left' ? item.left + item.width : item.left let x2 = item.dir === 'left' ? item.left + item.width : item.left
let y2 = item.top + item.height / 2 let y2 = item.top + item.height / 2
y1 = nodeUseLineStyle && !node.isRoot ? y1 + height / 2 : y1
y2 = nodeUseLineStyle ? y2 + item.height / 2 : y2
// 节点使用横线风格,需要额外渲染横线 // 节点使用横线风格,需要额外渲染横线
let nodeUseLineStylePath = '' let nodeUseLineStylePath = ''
if (this.mindMap.themeConfig.nodeUseLineStyle) { if (nodeUseLineStyle) {
if (item.dir === 'left') { if (item.dir === 'left') {
nodeUseLineStylePath = ` L ${item.left},${y2}` nodeUseLineStylePath = ` L ${item.left},${y2}`
} else { } else {
@ -273,6 +279,7 @@ class MindMap extends Base {
return [] return []
} }
let { left, top, width, height, expandBtnSize } = node let { left, top, width, height, expandBtnSize } = node
let nodeUseLineStyle = this.mindMap.themeConfig.nodeUseLineStyle
node.children.forEach((item, index) => { node.children.forEach((item, index) => {
let x1 = let x1 =
node.layerIndex === 0 node.layerIndex === 0
@ -284,6 +291,8 @@ class MindMap extends Base {
let x2 = item.dir === 'left' ? item.left + item.width : item.left let x2 = item.dir === 'left' ? item.left + item.width : item.left
let y2 = item.top + item.height / 2 let y2 = item.top + item.height / 2
let path = '' let path = ''
y1 = nodeUseLineStyle && !node.isRoot ? y1 + height / 2 : y1
y2 = nodeUseLineStyle ? y2 + item.height / 2 : y2
// 节点使用横线风格,需要额外渲染横线 // 节点使用横线风格,需要额外渲染横线
let nodeUseLineStylePath = '' let nodeUseLineStylePath = ''
if (this.mindMap.themeConfig.nodeUseLineStyle) { if (this.mindMap.themeConfig.nodeUseLineStyle) {

View File

@ -4,7 +4,7 @@
NewAutomatic line wrapping function is added to node text. NewAutomatic line wrapping function is added to node text.
Fix: Fix the problem of deletion exceptions if there are root nodes in the batch deleted nodes. Fix: 1.Fix the problem of deletion exceptions if there are root nodes in the batch deleted nodes. 2.Fix the problem that high node height will overlap with other nodes in the case of bottom edge style.
## 0.3.3 ## 0.3.3

View File

@ -3,7 +3,7 @@
<h1>Changelog</h1> <h1>Changelog</h1>
<h2>0.3.4</h2> <h2>0.3.4</h2>
<p>NewAutomatic line wrapping function is added to node text.</p> <p>NewAutomatic line wrapping function is added to node text.</p>
<p>Fix: Fix the problem of deletion exceptions if there are root nodes in the batch deleted nodes.</p> <p>Fix: 1.Fix the problem of deletion exceptions if there are root nodes in the batch deleted nodes. 2.Fix the problem that high node height will overlap with other nodes in the case of bottom edge style.</p>
<h2>0.3.3</h2> <h2>0.3.3</h2>
<p>Fix: The root node text cannot wrap.</p> <p>Fix: The root node text cannot wrap.</p>
<h2>0.3.2</h2> <h2>0.3.2</h2>

View File

@ -4,7 +4,7 @@
New节点文本增加自动换行功能。 New节点文本增加自动换行功能。
Fix修复批量删除的节点中如果存在根节点会出现删除异常的问题。 Fix1.修复批量删除的节点中如果存在根节点会出现删除异常的问题。2.修复底边风格的情况下,节点高度过高会和其他节点重叠的问题。
## 0.3.3 ## 0.3.3

View File

@ -3,7 +3,7 @@
<h1>Changelog</h1> <h1>Changelog</h1>
<h2>0.3.4</h2> <h2>0.3.4</h2>
<p>New节点文本增加自动换行功能</p> <p>New节点文本增加自动换行功能</p>
<p>Fix修复批量删除的节点中如果存在根节点会出现删除异常的问题</p> <p>Fix1.修复批量删除的节点中如果存在根节点会出现删除异常的问题2.修复底边风格的情况下节点高度过高会和其他节点重叠的问题</p>
<h2>0.3.3</h2> <h2>0.3.3</h2>
<p>修复根节点文字无法换行的问题</p> <p>修复根节点文字无法换行的问题</p>
<h2>0.3.2</h2> <h2>0.3.2</h2>