1. 组件封装成插件
// components/index.js
// 把components中所有的组件都进行全局注册
// 提供插件方式
import ImageView from './ImageView/index.vue'
import Sku from './XtxSku/index.vue'
export const componentPligin = {
install(app){
// app.component('组件名字',组件配置对象)
app.component('XtxImageView',ImageView)
app.component('XtxSku',Sku)
}
}
2. 引用注册文章来源:https://www.toymoban.com/news/detail-546621.html
// main.js
// 引用且注册
import {componentPligin} from "@/components/index"
app.use(componentPligin)
3. 使用组件文章来源地址https://www.toymoban.com/news/detail-546621.html
<!-- .vue-->
<!-- 使用全局组件,无需引用-->
<XtxImageView :image-list="goods.mainPictures"></XtxImageView>
<XtxSku :goods="goods" @change="skuChange"></XtxSku>
到了这里,关于Vue3---组件全局注册的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!