博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
vue中父子组件以及兄弟组件的传值情况?
阅读量:6992 次
发布时间:2019-06-27

本文共 770 字,大约阅读时间需要 2 分钟。

1.父向子传递?

首先父组件中定义了某个值name:张三,要想把这个值传递给子组件,这时子组件要想接收父组件的值则需要在自身组件上<son:myname="name"></son>,并需要在自身组件内用props:['myname']来定义。

2.子组件向父组件传递?

首先父组件在自身data上定义一个空的名字mysonname:' ',这时子组件在自身data上定义myname:"zhangsan",子组件要想把自己的名字传递给父组件则需要,在自身按钮上注册事件@click='tellname',由此在自身方法中注册该方法tellname(){this.$emit('callname',this.myname); }使用,这时在子组件标签中加入<son @callname="getname"></son>,在父组件中的methods方法中执行getname(){ this.mysonname=data}.

3.兄弟组件传值?

首先分别定义各自组件A.B组件,在B组件data中定义myname:"zhangsan",在自身模板按钮中注册点击事件@click="callsonname",并在自身方法中处理该方法callsonname(){ evevtbus.$emit('getmyname',this.myname)},父组件要想接收则需要在自身组件data上定义mydauname:'',

并用中间桥梁组件接收,使用mounted(){eventbus.$on('getmyname',data=>{this.mydauname=data})},

中间桥梁组件是:var eventbus=new Vue({}).

转载于:https://www.cnblogs.com/duanzhange/p/9531615.html

你可能感兴趣的文章
C# Request.InputStream 读取输入流为空的原因处理
查看>>
golang 中map并发读写操作
查看>>
zabbix自动发现
查看>>
c++和c动态申请二维数组
查看>>
在普通activity下布置代码逻辑
查看>>
mysql
查看>>
JAVA异常知识总结
查看>>
silverlight的第一个程序
查看>>
XSS注入方式和逃避XSS过滤的常用方法(整理)
查看>>
5. 最长回文子串
查看>>
[coursera] 面试前准备
查看>>
静态页跨页面传值
查看>>
.net core iis配置
查看>>
C#根据屏幕分辨率改变图片尺寸
查看>>
【POJ 3585】Accumulation Degree
查看>>
Solr配置,schema.xml的配置,以及中文分词
查看>>
数字型谜题或算法小节
查看>>
drupal7权限控制之-如何访问未发表的node
查看>>
.NET:权限管理
查看>>
hadoop多文件输出
查看>>