微信小程序自定义函数传参

前言

一般来说，需要用到bindtap方法来自定义一个函数，而使用这种函数传参的场景普遍为for循环的场景，废话不多说，直接上内容。

HTML部分

<view class="main  imgBox">
  <block wx:for="{{list}}" wx:key="key" wx:for-item="img">
    <image src="{{img.tempFilePath}}" class="mapImg" bindtap="onLocalImg" data-index="{{index}}"></image>
    <block wx:if="{{index+1==list.length}}">
      <image src="../../img/addImg.png" class="mapImg" bindtap="onAddImg"></image>
    </block>
  </block>
</view>

这里用bindtap方法绑定了一个onLocalImg方法，然后这里传参为当前for循环的索引,

 这里为什么传索引，而不是传具体参数，因为参数的标识可能会有在for循环里面有重复的，而索引不会
 

JS（TS）部分

  /**
   * @description 点击图片
   */
  onLocalImg(event: any) {
    const index = event.currentTarget.dataset.index
    const data = this.data.list
    data.splice(index, 1)
    this.setData({
      list: data
    })
  }

这里自定义的方法名称要与HTML里面的方法一致，然后定义任意一个形参（任意名称都行，但是普遍为e或者event,然后打印这个形参就可以拿到传递的值

该方法主要是拿到对应的索引，然后删除list列表里面对应的图片。

END

这里主要是注意绑定参数的名称，格式为data-aaa data-bbb 类型的data-是规定的格式。如果是绑定变量的话，需要加{{}}

完结撒花···