码迷,mamicode.com
首页 > 其他好文 > 详细

VUE组件通信(父传子)

时间:2019-07-23 09:59:14      阅读:725      评论:0      收藏:0      [点我收藏+]

标签:pre   计算   fat   computed   子函数   this   钩子函数   bsp   ret   

首先把父组件要传输的数据用自定义属性绑定在标签上

<father :father_data=‘ data ‘></father>

在子组件中用prpos接收

const childcomponent = {
  template:‘<child>{{son_data}}</child>‘,
  props:[‘ father_data‘],       //props[‘属性名‘]   (在父组件中用来绑定数据的属性名)
  data(){
     return{
       //用来接收数据的变量
       son_data:‘‘
     }
  },
  mounted(){
    //钩子函数,页面加载完成时把接收到的父组件传过来的值赋给子组件变量
    this.son_data = this.father_data
  }
//如果父组件数据发生改变 可以使用特么computed计算或者watch监听
}

 

VUE组件通信(父传子)

标签:pre   计算   fat   computed   子函数   this   钩子函数   bsp   ret   

原文地址:https://www.cnblogs.com/cola1orz/p/11229675.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!