vue-awesome-swiper参数传递问题

Question

vue项目里用到了vue-awesome-swiper 也就是swiper4插件，点每一个slide都可以跳转到详情页面，但是因为给swiper-slide绑定事件不触发，我就定义了一个全局变量vm然后在created里把this赋值给vm，然后在swiper的onClick回调里调用methods里的一个方法跳转页面
但是页面可以跳转，我该怎么拿到当前slide的参数呢 slide都是v-for循环出来的，怎样在点击的时候拿到当前slide对应的item呢
wiperOption: {

      freeMode: true,
      observer: true,
      observeParents: true,
      slidesPerView: 'auto',
      on: {
        click(evt) {
          console.log('取不到item')
          //vm.toGoodsDetail()
        }
      }
  }

<swiper :options="swiperOption" ref="mySwiper">

 <swiper-slide class="swiper-slide" :key="item.goods_id" v-for="item in goodsList">
    <img class="goods-img" :src="'item.image_key" alt="">
    <div class="goods-detail">
      <p class="goods-name">{{item.name}}</p>
      <p class="goods-period">10年质保</p>
      <p class="goods-price">
        <span>￥{{item.sell}}</span>
        <span>￥{{item.market}}</span>
      </p>
    </div>
    <img 
      @click="selectGift(item)"
      class="select-img"
      :src="item.goods_id === seletedId ? 'https://img.9999.cn/mp/618/s_n.png' : '/images/[e-mail]'" 
      alt=""
    >
  </swiper-slide>
</swiper>

methods: {
toGoodsDetail(item) {
  this.$router.push({
    name: 'goodsDetail'
  })
}

},

Answer 1

暂时想到的
前面定义const self = this

on: {
    click() {
      // self.goodsList[this.activeIndex],应该可以拿到item
    }
  }

Answer 2

用箭头函数

on: {
    click: e => {
        // 通过$refs获取对应的swiper对象
        let swiper = this.$refs.mySwiper.swiper;
        const realIndex = swiper.realIndex;
        // 点击事件响应绑定到图片上
        if (e.target.className === 'select-img') {
            this.selectGift(this.goodsList[realIndex]);
        }
    }
  }