vue组件全局注册和局部注册
全局注册如果想要一个组件在项目中哪里都可以直接调用,这个时候就需要用到全局注册,全局注册的缺点就是:注册了的全局组件,就算不需要用到,仍会占用内存1.创建组件创建一个文件zujian,在这个文件中创建zujian.vue,在zujian.vue中:<template><div>我是一个组件</div></template>2....
·
全局注册
如果想要一个组件在项目中哪里都可以直接调用,这个时候就需要用到全局注册,全局注册的缺点就是:注册了的全局组件,就算不需要用到,仍会占用内存
1.创建组件
创建一个文件zujian,在这个文件中创建zujian.vue,在zujian.vue中:
<template>
<div>我是一个组件</div>
</template>
2.创建index.js文件
在跟zujian.vue同级目录下创建一个index.js文件
import ZUJIAN from './zujian.vue';
const zj = {
install: function (Vue) {
Vue.component('ZuJian', ZUJIAN)
}
}
export default zj;
3.全局引入组件
在入口文件main.js中引入:
import ZuJian from '@/pages/zhuce-zujian/zujian'
Vue.use(ZuJian);
4.调用全局组件
前面已经注册好了全局组件,这个组件就可以在项目中任何地方调用了
<template>
<div>
<zu-jian />
</div>
</template>
局部注册
1.创建组件
创建一个组件zujian.vue
<template>
<div>我是一个组件11</div>
</template>
2.调用组件
<template>
<div>
<ZuJianJB />
</div>
</template>
<script>
import ZuJianJB from "./zujian/zujian";
export default {
components: {
ZuJianJB
}
};
</script>
更多推荐
已为社区贡献3条内容
所有评论(0)