微信小程序自定义组件-事件

文档地址https://developers.weixin.qq.com/miniprogram/dev/framework/custom-component/
页面-page

//.wxml
/* 
*   在这里：可以这样解读绑定组件·handleSearch·的方法，是本页面的·handlePageSearch·的方法
*/
<searchBar bind:handleSearch="handlePageSearch"></searchBar>
//.js
/*
 * 在·handlePageSearch·可以获取组件内传过来的值
*/
handlePageSearch(e) {
    console.log(e)
},

组件-searchBar

//.wxml
//组件绑定的方法是：handleSearch
<view class="searchContainer">
  <view class="iconfont icon-location" catch:tap="handleLocation"></view>
  <view>杭州</view>
  <view class="searchBox">
    <view class="iconfont icon-search"></view>

    <input placeholder='搜索精彩活动' confirm-type="search" bindconfirm="handleSearch22"></input>

  </view>
</view>
/*
* 自定义组件触发事件时，需要使用 triggerEvent 方法，指定事件名、detail对象和事件选项：
*/
//.js
handleSearch22(e) {
      const {value:searchvalue}=e.detail
      console.log(searchvalue)
      /*
       *这里的handleSearch必须和页面的<searchBar bind:handleSearch="..."></searchBar>的绑定的函数名一致
       *不必与·handleSearch22·一致即可
      */
      this.triggerEvent('handleSearch', { searchvalue}, {})
      //参数：

      // var myEventDetail = {} // detail对象，提供给事件监听函数
      // var myEventOption = {} // 触发事件的选项
      // this.triggerEvent('myevent', myEventDetail, myEventOption)
      // 详细见文档
    },