微信小程序自定义组件触发父级页面事件

一、自定义组件定义如下：

1. js文件

Component({  properties: {},  methods: {
    onTap: function () {
      var myEventDetail = {} // detail对象，提供给事件监听函数
      var myEventOption = {} // 触发事件的选项
      this.triggerEvent('myevent', myEventDetail, myEventOption)
    }  } })
2. wxml文件

<view class="wrapper">
  <view>这里是组件的内部节点</view>
  <slot></slot>
  <button bindtap="onTap">点击这个按钮将触发“myevent”事件</button>
</view>

二、引用组件的父级页面
1. js文件

Page({  data: { }, myEventListener: function(e) {  console.log(e)  } })

2. wxml文件

<view>
  <my-component bind:myevent="myEventListener"> </my-component>
</view>

注：其中的 “myevent” 事件只是一个标识符，并不是一个方法的名称（自定义组件中没有，父级页面中也没有），其被指定为 bind:myevent="myEventListener"事件。即自定义组件中通“myevent”这一个标识符等于（=）或代表MyEventListener方法。自定义组件中通过使用“ this.triggerEvent('myevent', myEventDetail, myEventOption)” 来触发父级页面中的 “myEventListener” 方法。