From bb8653fca12246e8f9a5c75df074c94bed57651a Mon Sep 17 00:00:00 2001
From: xiongjie <jiexiong@futunn.com>
Date: Wed, 19 Jun 2024 22:03:25 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E4=BF=AE=E5=A4=8D=E5=A4=96=E9=83=A8?=
 =?UTF-8?q?=E9=80=9A=E8=BF=87=20ref=20=E4=BC=A0=E9=80=92=E5=8F=82=E6=95=B0?=
 =?UTF-8?q?=E5=AF=BC=E8=87=B4=E4=B8=8D=E5=85=BC=E5=AE=B9=E7=9A=84=20Bug?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

当外部使用 const editor = ref() 来保存 editor 实例时，editor 会被封装成
reactive(editor) 这是一个 Proxy 对象。core 中通过
weakMap.get(ProxyHandler<editor>) 会存在取不到值的问题

通过 vue 的 toRaw 可以将一个 reactive 对象还原成原始的对象，该会方法对传递
editor 时会原生返回

toRaw 方法见：https://cn.vuejs.org/api/reactivity-advanced.html#toraw
---
 src/components/Toolbar.vue | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/components/Toolbar.vue b/src/components/Toolbar.vue
index 59c33be..3d69816 100644
--- a/src/components/Toolbar.vue
+++ b/src/components/Toolbar.vue
@@ -2,7 +2,7 @@
   <div ref="selector"></div>
 </template>
 <script lang="ts">
-import { defineComponent, ref, watchEffect, PropType } from 'vue'
+import { defineComponent, ref, watchEffect, PropType, toRaw } from 'vue'
 import { createToolbar, IToolbarConfig, IDomEditor, DomEditor } from '@wangeditor/editor'
 
 export default defineComponent({
@@ -47,7 +47,7 @@ export default defineComponent({
     watchEffect( () => {
       const { editor } = props
       if (editor == null) return
-      create(editor) // 初始化 toolbar
+      create(toRaw(editor)) // 初始化 toolbar
     })
 
     return {