本人也是vue的初学者,最近在搭建vue组件库的过程中,发现了一个vue2和vue3的区别点,具体体现在,使用vue3全局注册组件的时候(测试过程中使用),提示报错:Cannot read properties of undefined (reading 'component')

具体原因是这样的:
在vue 2 中注册全局组件的时候使用的是 Vue.component
,然后我们引入的是 import Vue from 'vue'
而我们在vue 3中引入的则是:import { createApp } from 'vue'
这时候,就算是我们从新引入 import Vue from 'vue'
也会报错,这就需要继续分析 Vue 和 createApp 的创造机制
首先看看正确的使用方式:
vue 2 全局注册组件
import Vue from 'vue'
import TkBadge from './components/TkBadge'
import App from './App.vue'
Vue.component('TkBadge', TkBadge) // 全局注册 - 我们可以在任何地方使用
new Vue({
render: h => h(App)
}).$mount('#app')
vue 3全局注册组件
import { createApp } from 'vue'
import TkBadge from './components/TkBadge'
import App from "./App.vue"
const app = createApp(App)
app.component('TkBadge', TkBadge)
app.mount('#app')
new Vue 和 createApp 的区别
可以参考:https://blog.51cto.com/u_15283585/4917386
隐藏模块
点击下面的广告小卡片,打开隐藏内容!!© 版权声明
THE END
暂无评论内容