一、微信小程序父组件向子组件传值
说明:父组件向子组件传值,通过 “组件的属性列表” properties
组件属性列表值,是单向绑定,内部修改组件属性不会同步显示;
组件外部 (父组件) 修改组件属性,内部展示跟着修改。
使用方式如下
1. 组件属性列表定义组件属性
Component({ /** * 组件的属性列表 */ properties: { innerMsg: { type: String, value: 'defaultvalue' }, showNum: { type: Number, value: 100 } },
2. 组件中使用、展示属性
<view class='red'> {{innerMsg}} </view> <view> 数字:{{showNum}} </view>
3. 父组件设置属性值
<show-two inner-msg='中文内容' show-num='11'></show-two>
显示结果:数字:11
二、微信小程序父组件调用子组件定义操作
说明:小程序中使用父组件对象的 selectComponent 方法,可以根据选择器获取第一个组件对象。
如果获取组件列表可以使用 selectAllComponents。
父组件示例代码:
addTwo: function () { //根据ID获取组件对象 var showTwo = this.selectComponent('#myShow'); //访问属性,使用data访问内部属性和组件属性 console.info(showTwo.data); //执行操作 showTwo.innerAdd(); //根据样式获取,建议使用selectAllComponents var showThree = this.selectComponent('.myShow'); console.info(showThree.data); showThree.innerAdd(); },
标签:
微信小程序组件间通信