> 文章列表 > 微信小程序组件之间传值(父传子、子传父)

微信小程序组件之间传值(父传子、子传父)

微信小程序组件之间传值(父传子、子传父)

一、父组件向子组件传值
1、父组件中的data值里的cvalue传给子组件

data: {cvalue:false,//切换视图值}

2、直接在引入子组件的那里写入

<calendars  cvalue="{{cvalue}}"></calendars>

3、最后在子组件里面接受:
(1)首先要在properties里面声明

properties: {cvalue:{type: String,value:''},//切换视图值
}

(2)在js里面就可以直接用this.data.cvalue引用了,或者在页面里面{{cvalue}}使用

二、子组件向父组件传值
1、在子组件的触发事件里面写入传入的函数

 this.triggerEvent("itemChange",this.data.chooseDay);

2、在父组件引入子组件的标签内写入,handle+传入的函数名

<calendars binditemChange="handleItemChange" cvalue="{{cvalue}}"></calendars>

3、在父组件data后面写入函数,用于接受子组件传过来的值

data:{chooseDay:'',cvalue:''},//子组件传值过来函数处理
handleItemChange(e) {console.log('eeeeeee', e);var dates = e.detail;this.setData({chooseDay:dates })}