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! ...
随机推荐
- 转:介绍一个好用的抓取dump的工具-ProcDump
介绍一个好用的抓取dump的工具-ProcDump Procdump是一个轻量级的Sysinternal团队开发的命令行工具, 它的主要目的是监控应用程序的CPU异常动向, 并在此异常时生成crash ...
- sql 多线程
1.codeproject上面一个多线程执行sql的库. 开发中常常要执行一些耗时的数据操作,比如update.insert.bulk insert.index creation, 若顺序执行,则操作 ...
- linux 系统下MySQL5.7重置root密码(完整版,含ERROR 1820 (HY000)解决方案)
mysql的root密码忘记了怎么重置? 往下看: 1.保证你的mysql服务处于关闭状态.(用ps -ef | grep mysql 查看进程,有则kill -9 进程号) 2.在my.cnf所在目 ...
- java-FileDemo
关于file类的使用:文件的增删查 package com.example; import java.io.File; import java.io.IOException; public class ...
- ArrayList和Vector性能对比
测试条件: 循环次数:1千万次 元素个数:1000个 测试结果: 总结:ArrayList获取元素非常快,不过添加元素没有Vector快,两者各有优势,Vector是线程安全的,而ArrayList是 ...
- Spring @Transactional
在service类前加上@Transactional,声明这个service所有方法需要事务管理.每一个业务方法开始时都会打开一个事务. Spring默认情况下会对运行期例外(RunTimeExcep ...
- 【转载】使用SoapUI 测试Web Service
转载地址:使用SoapUI 测试Web Service 如何测试写好的Webservice?你当然可以写代码来测试,但还是太麻烦,你得花时间去学习各语言的关于Webservice调用的相关API. ...
- ps -aux --sort -rss |head 列出进程拿物理内存占用排序 使用ps aux 查看系统进程时,第六列即 RSS列显示的就是进程使用的物理内存。
ps -a Select all processes -u userlist Select by effective user ID (EUID) or name. ...
- 个人博客开发之 全局配置文件settings设置
项目源码下载:http://download.vhosts.cn # -*- coding: utf-8 -*- """ Django settings for cpyb ...
- CSS权威指南(第3版)
第一章 基础介绍 介绍了css的好处, 编辑一个文件多处使用, 层叠: 指式样有矛盾时, 可以覆盖掉之前的式样, 便于维护 等等. 块级元素:会生成一个元素框, (默认地)它会填充其父元素的内容区, ...