chore: jsonEditor.value could be undefined in Vue 2.6 (dev environment)

cloydlau · cloydlau · commit 8058e351245a · 2022-11-24T11:41:58.000+08:00
diff --git a/auto-imports.d.ts b/auto-imports.d.ts
@@ -36,6 +36,7 @@ declare global {
   const readonly: typeof import('vue')['readonly']
   const ref: typeof import('vue')['ref']
   const resolveComponent: typeof import('vue')['resolveComponent']
+  const resolveDirective: typeof import('vue')['resolveDirective']
   const shallowReactive: typeof import('vue')['shallowReactive']
   const shallowReadonly: typeof import('vue')['shallowReadonly']
   const shallowRef: typeof import('vue')['shallowRef']
diff --git a/demo/vue2.6/index.vue b/demo/vue2.6/index.vue
@@ -19,10 +19,8 @@
     </p>
 
     <br>
-    <JsonEditorVue
-      ref="jsonEditorVueRef" v-model="data.value" :mode.sync="data.mode"
-      :readOnly="data.readOnly"
-    />
+    <JsonEditorVue ref="jsonEditorVueRef" v-model="data.value" :mode.sync="data.mode"
+      :readOnly="data.readOnly" />
 
     <br>
     <p>Mode</p>
@@ -52,7 +50,6 @@ export default {
       hasSetup = true
     }
 
-    const jsonEditorVueRef = ref()
     const data = reactive<{
       value: any
       mode?: Mode
@@ -63,17 +60,18 @@ export default {
       readOnly: false,
     })
 
+    /* const jsonEditorVueRef = ref()
     onMounted(() => {
       console.log(jsonEditorVueRef.value)
-    })
+    }) */
 
     return {
-      jsonEditorVueRef,
+      //jsonEditorVueRef,
       data,
     }
   },
   mounted() {
-    console.log(this.$refs.jsonEditorVueRef.jsonEditor.expand)
+    console.log('expand: ', this.$refs.jsonEditorVueRef.jsonEditor.expand)
   },
 }
 </script>
diff --git a/demo/vue2.7/index.vue b/demo/vue2.7/index.vue
@@ -32,22 +32,17 @@
   </div>
 </template>
 
-<script setup lang="ts">
+<script setup>
 import JsonEditorVue from '../../src'
-import type { Mode } from '../../src'
 
-const data = reactive<{
-  value: any
-  mode?: Mode
-  readOnly: boolean
-}>({
+const data = reactive({
   value: undefined,
   mode: undefined,
   readOnly: false,
 })
 
 const jsonEditorVueRef = ref()
 onMounted(() => {
-  console.log(jsonEditorVueRef.value.jsonEditor.expand)
+  console.log('expand: ', jsonEditorVueRef.value.jsonEditor.expand)
 })
 </script>
diff --git a/demo/vue3/index.vue b/demo/vue3/index.vue
@@ -65,6 +65,6 @@ const data = reactive<{
 
 const jsonEditorVueRef = ref()
 onMounted(() => {
-  console.log(jsonEditorVueRef.value.jsonEditor.expand)
+  console.log('expand: ', jsonEditorVueRef.value.jsonEditor.expand)
 })
 </script>
diff --git a/index.html b/index.html
@@ -5,7 +5,7 @@
   <meta charset="UTF-8" />
   <link rel="icon" href="/favicon.ico" />
   <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  <title>{{NAME}} + Vue {{VUE_VERSION}}</title>
+  <title>Vue {{VUE_VERSION}}</title>
 </head>
 
 <body>
diff --git a/package.json b/package.json
@@ -82,7 +82,7 @@
     "lint-staged": "latest",
     "lossless-json": "latest",
     "typescript": "latest",
-    "unplugin-auto-import": "0.11.2",
+    "unplugin-auto-import": "latest",
     "vanilla-jsoneditor": "latest",
     "vite": "latest",
     "vite-plugin-dts": "latest",
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
diff --git a/src/Component.ts b/src/Component.ts
