网站建设资讯

NEWS

网站建设资讯

vue组件父与子通信详解(一)

本文实例为大家分享了vue组件父与子通信的具体代码,供大家参考,具体内容如下

创新互联专注为客户提供全方位的互联网综合服务,包含不限于成都网站设计、成都网站制作、卢氏网络推广、微信小程序、卢氏网络营销、卢氏企业策划、卢氏品牌公关、搜索引擎seo、人物专访、企业宣传片、企业代运营等,从售前售中售后,我们都将竭诚为您服务,您的肯定,是我们最大的嘉奖;创新互联为所有大学生创业者提供卢氏建站搭建服务,24小时服务热线:028-86922220,官方网址:www.cdcxhl.com

一、组件间通信(父组件    -->  子组件)

步骤:

①父组件在调用子组件 传值

 

②在子组件中 获取父组件传来的值

Vue.component('child-component',{
  props:['myValue'],
  template:''
})

代码1:



 
 
 父传子
 
 
 
 

{{msg}}

myValue是属性名,必须都一样……拿data中的用v-bind:或者:
props是property属性,是个数组

代码2:



 
 
 父子之间通信练习
 
 
 
 

{{msg}}

代码3:




 
 
 



要拿到data中的数据就要v-bind,否则就不用。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持创新互联。


文章标题:vue组件父与子通信详解(一)
当前路径:http://cdweb.net/article/ipogij.html