淄博网站建设 熊掌号,幻想次元wordpress,视频怎么转wordpress,扬州房产网一、问题重现
我们用过vue的人都知道会有一个components文件夹用来存放我们的通用组件#xff1a; 这里我的通用组件就有四个#xff0c;但是有一些是使用评率比较高的#xff0c;如果很多地方要使用我还得导入相同的组件#xff0c;写的都是一样的代码#xff1a;
impo…一、问题重现
我们用过vue的人都知道会有一个components文件夹用来存放我们的通用组件 这里我的通用组件就有四个但是有一些是使用评率比较高的如果很多地方要使用我还得导入相同的组件写的都是一样的代码
import Imageview from ./ImageView/index.vue
import Xtsku from ./Xtsku/index.vue
那我为什么不化简一下或者说我就做一些封装写一些逻辑函数最好的就是将他们都升级为全局组件来看看我是怎么做的。
二、使用组件注册机制
不妨碍components文件夹下面创建一个index文件 我们将频繁使用到的组件在这个文件里全部导入一遍
import Imageview from ./ImageView/index.vue
import Xtsku from ./Xtsku/index.vueexport const componentplugin {install(app){app.component(Imageview,Imageview)app.component(Xtsku,Xtsku)}} 然后通过install这个函数将这些组件按照插件的注册当时升级成全局组件就可以了
在main文件里面
import {componentplugin} from /components
app.use(componentplugin)
这样就可以全局拿到这几个通用组件了。
三、使用方法
无论那个组件 ImageView :image-listgoods.mainPictures/
咋们直接用就可以了直接写元素都是一样的效果
四、提重点
最主要的就是要知道如何写这个install函数其实这个直接写在main文件里面也是一样的只不过这里将它模块化分开了更便于后期维护和管理