微信小程序父组件调用子组件的方法


一、微信小程序父组件调用子组件的方法

1.在子组件的methods里定义方法

Component({
    data: {
        selectSizeShow:false
    },
    properties: {... ...},
    methods: {
        selectSizeshowPopup() {
            this.setData({ selectSizeShow: true });
        },
        selectSizeonClose() {
            this.setData({ selectSizeShow: false });
        },
    },
})

2.父组件调用

在wxml里定义一个id唯一标识
showSelectSize 用来触发子组件的方法
父组件index.js中通过id标识获取子组件对象,并调用子组件的方法

<selectSize id="selectSize" options="{{optionsSize}}" atSize="{{atSize}}"  bind:switchSize="switchSize"></selectSize>
<van-icon name="setting-o" class="headerIcon" bindtap="showSelectSize"/>
Page({
    data: {... ...},
    // 激活切换分辨率/尺寸的组件
    showSelectSize() {
        var selectSizeObj = this.selectComponent("#selectSize")
        console.log(selectSizeObj.data) //子组件的数据
        selectSizeObj.selectSizeshowPopup() //子组件的方法
    },
})

文章作者: nzgl
版权声明: 本博客所有文章除特別声明外,均采用 CC BY 4.0 许可协议。转载请注明来源 nzgl !
评论
  目录