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

如果需要调用下面自定义组件里面的 clear () 方法,不知道怎么自定义组件去看一下官方文档很详细。
自定义组件 .js 文件:

Component({

  // 组件的属性列表
  properties: {
    // 线宽度
    lineWidth: {
      type: Number,
      value: 1,
      // 属性变化则调用
      observer (e) {
        if (this.data.ctx) { this.data.ctx.lineWidth = e }
      }
    }
  },

  // 组件的初始数据
  data: {

  },

  // 组件生命周期函数 - 在组件布局完成后执行
  ready () {

  },

  // 组件生命周期函数 - 在组件实例被从页面节点树移除时执行
  detached () {

  },

  // 组件的方法列表
  methods: {
    // 自定义方法
    clear () {
      console.log("调用了自定义组件内部方法");
    }
  }
})

例如我的组件名称叫 drawing-board,在正常页面上使用自定义组件

<drawing-board line-width="10" id="drawing-board"></drawing-board>

然后在当前使用页面的 .js 文件里面获取到组件进行调用方法

/**
 * 页面的初始数据
 */
data: {
  // 当前画板
  drawingBoard: undefined
},

/**
 * 生命周期函数--监听页面初次渲染完成
 */
onReady: function () {
  this.drawingBoard = this.selectComponent('#drawing-board')
},

// 调用自定义组件方法
touchClear () {
  this.drawingBoard.clear()
},

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值