vue组件调用(全局调用和局部调用)

当用vue-cli创建一个项目后,

创建项目的方法: https://www.cnblogs.com/fps2tao/p/9376847.html

编写了组件怎么,在其他组件中调用了?

组件listBox: 路径 src/components/listBox.vue

<template><div class="listBox">listBox222</div>
</template><script>
export default {name: "listBox",data:function(){return {}}
}
</script><style scoped></style>

1.全局组件注册复用

mian.js文件

import listBox from './components/listBox'//全局组件注册
Vue.component('listBox',listBox);

2.局部组件注册复用

在要使用的组件中引用将要调用的组件

比如在App.vue中使用listBox 那么,App.vue下发如下:

<template><div id="app"><img src="./assets/logo.png"><router-view/><listBox></listBox></div>
</template><script>
import listBox from './components/listBox'export default {name: 'App',components:{'listBox':listBox}
}
</script><style>
#app {font-family: 'Avenir', Helvetica, Arial, sans-serif;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;text-align: center;color: #2c3e50;margin-top: 60px;
}
</style>

转载于:https://www.cnblogs.com/fps2tao/p/9377652.html

vue组件调用(全局调用和局部调用)相关推荐

Vue组件之全局组件与局部组件
组件 (Component) 是 Vue.js 最强大的功能之一.组件可以扩展 HTML 元素,封装可重用的代码.在较高层面上,组件是自定义元素,Vue.js 的编译器为它添加特殊功能.在有些情况下, ...
vue组件通信---全局事件总线（任意组件间通信）
描述: 全局事件总线是组件间通信的一种方式,适用于任意组件间通信 1.安装全局事件总线: 在main.js入口文件中完成全局事件总线的安装配置 new Vue({el:'#app',render: h ...
【视频】vue组件的全局注册
P8vue组件的定义 https://www.bilibili.com/video/av91679349?p=8
uniapp 子组件 props拿不到数据_来吧！一文彻底搞定Vue组件！
点击蓝色 "达达前端小酒馆" 关注我哦! 加个 "星标" ,每天一篇文章,一起学编程作者 | Jeskson 来源 | 达达前端小酒馆 Vue组件的概述 ...
Vue 组件学习总结
本文主要是对 Vue 组件学习的总结和之后要写的内容的计划. 组件学习总结组件库的本质是什么? 组件库其实就是一堆组件组成的一个项目,一般项目里会有组件和演示项目.当项目调试时 webpack 打包 ...
vue 组件递归方法
遇到那种嵌套层数不知道的数据很头疼的,目前为了解决头疼的方法就是vue组件递归方法.说白了就是自己调用自己.下面的案例是vue3语法环境,复制粘贴可以在调整到vue2的环境,代码直接复制使用. ch ...
Vue 组件传值通信、父子组件、爷孙组件传值、方法调用
组件传:vue子组件改变父组件中data的值_mldwyy的博客-CSDN博客_子组件修改父组件data 参考 https://www.cnblogs.com/lianxisheng/p/109073 ...
Vue组件的三种调用方式
最近在写fj-service-system的时候,遇到了一些问题.那就是我有些组件,比如Dialog.Message这样的组件,是引入三方组件库,比如element-ui这样的,还是自己实现一个?虽然 ...
Vue 组件之间传值、调用组件的函数
传值: 组件: @Component({props: {photoLists: {}} }) 调用组件: .ts private photoLists = []; .vue <photograp ...
vue 组件递归(组件自己调用自己)
vue 组件递归项目中,用到 el-menu, 侧边栏导航动态加载时,需要用到组件递归,不然js写逻辑,有点繁琐. 干货多,屁话少,上代码给组件name值 export default {name ...

vue组件调用(全局调用和局部调用)

vue组件调用(全局调用和局部调用)相关推荐

最新文章

热门文章