Vue.js之组件嵌套
Vue.js中组件嵌套有两种方式
第一种:注册全局组件
例如在components文件夹下新建一个User.vue组件,然后在main.js文件中注册全局组件
//注册全局组件
Vue.component("users",Users); //前面的users是我们起的名字,后面的Users是我们对应的组件,想要识别这个组件,必须在上面通过import引入,
//引入组件
import Users from ‘./components/Users’
有了全局组件的话,就可以在任何一个地方去调用这个东西,然后在App.vue中使用 <users></users> 标签去调用它。
但是一般都使用局部的组件,很少使用全局组件。
第二种:局部组件
在需要使用该组件的组件中,在<script> 中使用 import Users from './components/Users' 引入组件,然后在下面注册组件,在这里注册组件有两种方法:
第一种是:
components:{
"users":Users
}
第二种是:
components:{
Users
}
第二种省略了“users”直接使用Users,这样也是可以的。
注意:如果采用第一种方法,起的别名不能和已有的标签冲突,否则不生效。
Vue.js之组件嵌套的更多相关文章
- Vue.js多重组件嵌套
Vue.js多重组件嵌套 Vue.js中提供了非常棒的组件化思想,组件提高了代码的复用性.今天我们来实现一个形如 <app> <app-header></app-head ...
- Vue.js之组件嵌套小demo
Vue.js之组件嵌套的小demo项目 第一步:初始化一个wabpack项目,这里不在复述.第二步:在components文件夹下新建Header.vue Footer.vue和Users.vue三个 ...
- 【Vue课堂】Vue.js 父子组件之间通信的十种方式
这篇文章介绍了Vue.js 父子组件之间通信的十种方式,不管是初学者还是已经在用 Vue 的开发者都会有所收获.无可否认,现在无论大厂还是小厂都已经用上了 Vue.js 框架,简单易上手不说,教程详尽 ...
- 【Vue.js实战案例】- Vue.js递归组件实现组织架构树和选人功能
大家好!先上图看看本次案例的整体效果. 浪奔,浪流,万里涛涛江水永不休.如果在jq时代来实这个功能简直有些噩梦了,但是自从前端思想发展到现在的以MVVM为主流的大背景下,来实现一个这样繁杂的功能简直不 ...
- Vue.js之组件传值
Vue.js之组件传值 属性传值可以从父组件到子组件,也可以从子组件到父组件. 这里讲一下从父组件到子组件的传值 还以上次的demo为例,demo里有APP.vue是父组件,Header.vue,Us ...
- vue.js 同级组件之间的值传递方法(uni-app通用)
vue.js 兄弟组件之间的值传递方法 https://blog.csdn.net/jingtian678/article/details/81634149
- Vue.js说说组件
什么是组件:组件是Vue.js最强大的功能之一.组件可以扩展HTML元素,封装可重用的代码.在较高层面上,组件是自定义的元素,Vue.js的编译器为它添加特殊功能.在有些情况下,组件也可以是原生HTM ...
- Vue.js使用-组件(上篇)
1.什么是组件 组件可以理解为定义的一个view模块,可重复使用. 2.组件使用 1)创建组件 var myComponent = Vue.extend({ template: ' this is a ...
- 用Vue.js递归组件构建一个可折叠的树形菜单
在Vue.js中一个递归组件调用的是其本身,如: Vue.component('recursive-component', { template: `<!--Invoking myself! ...
随机推荐
- 由于删除DBF文件报错 —— ORA-01033: ORACLE initialization or shutdown in progress
由于移动或删除DBF文件报错:ORA-01033: ORACLE initialization or shutdown in progress 原因:一般该类故障通常是由于移动文件而影响了数据库日 ...
- 改变Prompt默认路径,Change Default Visual Studio Command Prompt Location
在项目中经常需要使用 Visual Studio Command Prompt编译项目,每次启动时都是默认进入 C:\windows\system32> 目录, 需要cd切换路径,如果把Visu ...
- js 判断是否为数组
http://www.jb51.net/article/79939.htm Object.prototype.toString.call([1,2,3,4]) == '[object Array]'
- MySql(零):Linux(CentOS7)下安装和配置MySQL5.7.20(安装包安装)
一.下载安装包 1.在官网下载MySQL5.7安装包 mysql-5.7.20-linux-glibc2.12-x86_64.tar.gz. 下载地址:https://dev.mysql.com/do ...
- DMA摘记
1.特点 PIO模式下硬盘和内存之间的数据传输是由CPU来控制的:而在DMA模式下,CPU只须向DMA控制器下达指令,让DMA控制器来处理数据的传送,数据传送完毕再把信息反馈给CPU,这样就很大程度上 ...
- Html添加百度地图
方法/步骤 1.打开“百度地图生成器”的网址:http://api.map.baidu.com/lbsapi/creatmap/index.html 如下图: 2.在“1.定位中心点”中,切换城市,并 ...
- Shell脚本与vi编辑器:vi启动与退出、工作模式、命令大全
Vi简介 Vi是一种广泛存在于各种UNIX和Linux系统中的文本编辑程序. Vi不是排版程序,只是一个纯粹的文本编辑程序. Vi是全屏幕文本编辑器,它没有菜单,只有命令. Vi不是基于窗口的,所以, ...
- 常用的Http组件
日常生活中,我们接触最多的Http组件就是浏览器了!但是,还有其他也很重要的组件,下面容我慢慢盘点: 1.代理服务器 代理服务器就是帮助我们发送请求报文,接受响应报文的服务器.对web服务器而言,代理 ...
- 蓝桥杯 如何计算 X^X = 10 来求X呢?
题目中有说道:X的取值范围大于2小于3 高数书上中方程的近似解有讲到到:(同济第六版180页) ln(x^x)- ln(10)=0; x*ln(x) -ln(10)=0; 假设:F(x) = X*l ...
- js中级系列三:前端性能优化
原文链接:http://www.cnblogs.com/xxcanghai/p/5205998.html 链接:http://www.zhihu.com/question/21658448/answe ...