hinesboy / mavonEditor

mavonEditor - A markdown editor based on Vue that supports a variety of personalized features
http://www.mavoneditor.com/
MIT License
6.38k stars 916 forks source link

in vue3 and vite according to example Appear TypeError: Cannot read properties of undefined (reading '_c') #789

Closed VentFiree closed 2 years ago

VentFiree commented 2 years ago

main.js

import { createApp } from 'vue'

.....................

//markdown 
import mavonEditor from 'mavon-editor'
import 'mavon-editor/dist/css/index.css'

...................

const app = createApp(App)

.....................
app.component("mavon-editor", mavonEditor);

.....................
app.use(mavonEditor)
......................
app.mount('#app')

package.json

{
 "scripts": {
    "dev": "vite",
    "build:prod": "vite build",
    "build:stage": "vite build --mode staging",
    "preview": "vite preview"
  },
  "repository": {
    "type": "git",
    "url": "https://gitee.com/y_project/RuoYi-Vue.git"
  },
  "dependencies": {
    "@element-plus/icons-vue": "1.1.4",
    "axios": "0.26.1",
    "commonmark": "^0.30.0",
    "echarts": "5.3.2",
    "element-plus": "2.1.8",
    "file-saver": "2.0.5",
    "fuse.js": "6.5.3",
    "js-cookie": "3.0.1",
    "jsencrypt": "3.2.1",
    "mavon-editor": "^2.10.4",
    "nprogress": "0.2.0",
    "vue": "3.2.31",
    "vue-cropper": "1.0.3",
    "vue-router": "4.0.14",
    "vuex": "4.0.2"
  },
  "devDependencies": {
    "@vitejs/plugin-vue": "2.3.1",
    "@vue/compiler-sfc": "3.2.31",
    "sass": "1.50.0",
    "unplugin-auto-import": "0.6.9",
    "vite": "2.6.14",
    "vite-plugin-compression": "0.5.1",
    "vite-plugin-svg-icons": "1.0.5",
    "vite-plugin-vue-setup-extend": "0.4.0"
  }
}

my router.js

// 
export const constantRoutes = [
  {
    path: '/login',
    component: () => import('@/views/login'),
    hidden: true
  },
  {
    path: '/m_test',
    component: () => import('@/views/test'),
  },
}

my vue

<template>
  <div>
    <h2>this is test page</h2>
    <input type="text" v-model="value" />
    <br>
    <input type="text" v-model="value" />
    <mavon-editor v-model="value"/>
  </div>
</template>

<script>
import { ref } from "vue";
export default {
  name:"test page",
  setup() {
    let value = ref("");

    return {
      value,
    };
  },
};
</script>

<style>
</style>

But there is a problem image

when i delete this <mavon-editor v-model="value"/>The page loads normally image

Hope someone can clear my confusion, preferably explain why

VentFiree commented 2 years ago

you should update "mavon-editor": "^3.0.0-beta", in package.json:"mavon-editor": "^2.10.4",