打包0.6.3

web/src/pages/Doc/zh/course20/index.md

@@ -37,7 +37,7 @@ node.nodeData.data
             <h1>我是自定义节点</h1>
             ${ node.nodeData.text }
         `
-        return dev
+        return div
     }
 }
 ```
@@ -96,3 +96,19 @@ import i18n from './i18n'
 
 ## 示例3：渲染Vue3组件
 
+```js
+import { createApp } from "vue"
+import CustomNodeContent from './CustomNodeContent.vue'
+
+{
+    customCreateNodeContent: (node) => {
+        let el = document.createElement('div')
+        const app = createApp(CustomNodeContent, {// props
+            html: node.nodeData.data.text
+        })
+        app.mount(el)
+        return el
+    }
+}
+```
+

web/src/pages/Doc/zh/course20/index.vue

@@ -28,7 +28,7 @@
             <h1>我是自定义节点</h1>
             <span class="hljs-subst">${ node.nodeData.text }</span>
         `</span>
-        <span class="hljs-keyword">return</span> dev
+        <span class="hljs-keyword">return</span> div
     }
 }
 </code></pre>
@@ -78,6 +78,20 @@
 }
 </code></pre>
 <h2>示例3：渲染Vue3组件</h2>
+<pre class="hljs"><code><span class="hljs-keyword">import</span> { createApp } <span class="hljs-keyword">from</span> <span class="hljs-string">&quot;vue&quot;</span>
+<span class="hljs-keyword">import</span> CustomNodeContent <span class="hljs-keyword">from</span> <span class="hljs-string">&#x27;./CustomNodeContent.vue&#x27;</span>
+
+{
+    <span class="hljs-attr">customCreateNodeContent</span>: <span class="hljs-function">(<span class="hljs-params">node</span>) =&gt;</span> {
+        <span class="hljs-keyword">let</span> el = <span class="hljs-built_in">document</span>.createElement(<span class="hljs-string">&#x27;div&#x27;</span>)
+        <span class="hljs-keyword">const</span> app = createApp(CustomNodeContent, {<span class="hljs-comment">// props</span>
+            <span class="hljs-attr">html</span>: node.nodeData.data.text
+        })
+        app.mount(el)
+        <span class="hljs-keyword">return</span> el
+    }
+}
+</code></pre>
 
   </div>
 </template>

web/src/pages/Edit/components/Edit.vue

@@ -300,7 +300,7 @@ export default {
         ...(config || {}),
         iconList: icon,
         useLeftKeySelectionRightKeyDrag: this.useLeftKeySelectionRightKeyDrag,
-        isUseCustomNodeContent: false,
+        // isUseCustomNodeContent: true,
         // 示例1：组件里用到了router、store、i18n等实例化vue组件时需要用到的东西
         // customCreateNodeContent: (node) => {
         //   let el = document.createElement('div')