事件绑定 和 方法传值

冒泡和非冒泡事件绑定

• bindtap: 冒泡事件绑定
• catchtap: 非冒泡事件绑定当其他的事件冒泡到当前元素绑定的非冒泡事件时，同样不会触发。

-- wxml --
<view bindtap="handleTag1">
  outer

  <view catchtap="handleTag2">
    center
  </view>

  <view bindtap="handleTag3">
    inner
  </view>
</view>

-- js --
 handleTag1() {
    console.log(`outer`)
  },
  handleTag2() {
    console.log(`center`)
  },
  handleTag3() {
    console.log(`inner`)
  }

运行结果：

• 点击 outer 时： 输出 outer
• 点击 center 时：输出 center
• 点击 inner 时：输出 inner outer

方法传值

在 wx 小程序中，调用方法传递参数可以大致分为两种情况。

1. js其他方法 内部调用

  /**
   * 生命周期函数--监听页面加载
   */
 onLoad: function (options) {
    this.requestData(34)
  },
 requestData(id) {
    console.log(id)
  }

这种情况下，直接通过 调用方法传递参数即可

2. 视图中调用方法

在视图(wxml文件) 中调用方法时，不能通过method(params) 这种方式来传递参数。这是需要使用自定义数据来传递参数data-name="xxx"，在 js 中，通过 event 对象 来获取。

-- wxml --
<view data-id="123" data-msg="yaHello" bindtap="requestViewData">
  2333
</view>

-- js --
  requestViewData(event) {
    console.log(event.currentTarget.dataset.id)
    console.log(event.currentTarget.dataset.msg)
  }

当触发事件时，会输出 dataset.id123 及 dataset-msgyaHello。