vue中子组件向父组件传值
1.子组件$emit()触发,父组件$on()监听
子组件:
<template>
<div class="hello">
<button v-on:click="onClickMe">telltofather</button>
</div>
</template> <script>
export default {
methods: {
onClickMe () {
this.$emit('childClick',this.msg);//将this.msg传给父组件
}
}
}
</script>
父组件:
<template>
<div id="app">
<p>child tell me: {{childWords}}</p>
<child v-on:childClick='listenToMyBoy'>
</child>
</div>
</template > <script> import child from './components/child';
export default {
components: {
child
},
data () {
return {
childWords: ''
}
},
methods: {
listenToMyBoy (msg) {
this.childWords = msg;//获取到子组件传过来的值msg
}
}
}
</script>
vue中子组件向父组件传值的更多相关文章
- Vue 组件&组件之间的通信 之 子组件向父组件传值
子组件向父组件传值:子组件通过$.emit()方法以事件形式向父组件发送消息传值: 使用步骤: 定义组件:现有自定义组件com-a.com-b,com-a是com-b的父组件: 准备获取数据:父组件c ...
- vue+elementUI项目,父组件向子组件传值,子组件向父组件传值,父子组件互相传值。
vue+elementUI项目,父组件向子组件传值,子组件向父组件传值,父子组件互相传值. vue 父组件与子组件相互通信 一.父组件给子组件传值 props 实现父组件向子组件传值. 1父组件里: ...
- 【转】Vue组件一-父组件传值给子组件
Vue组件一-父组件传值给子组件 开始 Vue组件是学习Vue框架最比较难的部分,而这部分难点我认为可以分为三个部分学习,即 组件的传值 - 父组件向子组件中传值 事件回馈 - 子组件向父组件发送消息 ...
- Vue中子组件调用父组件的方法
Vue中子组件调用父组件的方法 相关Html: <!DOCTYPE html> <html lang="en"> <head> <meta ...
- Vue 编程之路(三)—— Vue 中子组件在父组件的 v-for 循环里,父组件如何调取子组件的事件
(标题的解决方案在第二部分) 最近公司的一个项目中使用 Vue 2.0 + element UI 实现一个后台管理系统的前端部分,属于商城类型. 一.前期思路: 其中在“所有订单”页面,UI 给的设计 ...
- vue.js+koa2项目实战(五)axios 及 vue2.0 子组件和父组件之间的传值
axios 用法: 1.安装 npm install axios --save-dev 2.导入 import axios from 'axios'; 3.使用 axios.post(url,para ...
- vue父组件调用子组件方法、父组件向子组件传值、子组件向父组件传值
一.父组件调用子组件方法 父组件代码 parent.vue <template> <div> <button @click="parentFun" ...
- VUE中的子父组件、兄弟组件之间相互传值,相互调用彼此的方法
vue--组件传值 父组件传值给子组件--"props" 一.父组件--示例 <template> <child :choose-data="choos ...
- 使用vue开发输入型组件更好的一种解决方式(子组件向父组件传值,基于2.2.0)
(本人想封装一个带有input输入框的组件) 之前使用vue开发组件的时候,在遇到子组件向父组件传递值时我采用的方法是这样的: 比如子组件是一个输入框,父组件调用时需要获取到子组件输入的值,子组件通过 ...
随机推荐
- 九度oj 题目1063:整数和
题目1063:整数和 时间限制:1 秒 内存限制:32 兆 特殊判题:否 提交:4043 解决:2638 题目描述: 编写程序,读入一个整数N.若N为非负数,则计算N到2N之间的整数和:若N为一个负数 ...
- Excel表格如何设置密码 Excel2003/2007/2010设置密码教程
http://www.wordlm.com/special/2/ 经常使用Excel表格制作报表和一些数据后,我们会给Excel表格设置密码,这样可以很有效的防止数据被盗取.目前Office版本众多, ...
- 【HDOJ5713】K个联通块(状压DP,计数)
题意:有一张无重边的无向图, 求有多少个边集,使得删掉边集里的边后,图里恰好有K个连通块. 1≤T≤201≤K≤N≤140≤M≤N∗(N+1)/21≤a,b≤N 思路:From http://blog ...
- Linux系统备份还原工具3(使用Clonezilla/再生龙对硬盘进行镜像和克隆,类似于Ghost)
说明:经过实验验证,再生龙主要是适合在本机还原原大小的分区,不适合将镜像备份还原到不同大小分区,期间可能有很多莫名奇妙的问题出现.硬盘对拷和PXE网刻这些没发现什么不好.如果要还原到别的电脑镜像制作时 ...
- 二 hbase
Hbase 本文介绍Hbase.但本文的前提是假设你已经读过Google的BigTable论文. Introduction Hbase 是基于Google Big Table用java实现的分布式,列 ...
- 我的arcgis培训照片10
来自:http://www.cnblogs.com/gisoracle/p/4297439.html
- 智能眼镜技术科普:VR、AR、MR的区别
前段时间, 获得谷歌5亿美元融资的技术公司Magic Leap在WSJD展会中放出了一段实录视频,引起不小骚动.如今,也有媒体称他们为MR公司,那么VR.AR.MR之间到底有什么区别呢. VR.AR. ...
- Django学习系列之ORM-QuerySetAPI
基本操作 # 增 models.Tb1.objects.create(c1='xx', c2='oo') #增加一条数据,可以接受字典类型数据 **kwargs obj = models.Tb1(c1 ...
- android自己定义控件系列教程----视图
理解android视图 对于android设备我们所示区域事实上和它在底层的绘制有着非常大的关系,非常多时候我们都仅仅关心我们所示,那么在底层一点它究竟是怎么样的一个东西呢?让我们先来看看这个图. w ...
- lua遍历目录
require"lfs" function findindir (path, wefind, r_table, intofolder) for file in lfs.dir(pa ...