swiper中的切换事件

swiper中的事件，请参考官方文档，这里需要注意安装的swiper的版本

<HeaderTab
      @toParent="getNowIndex"
      :tabInfo="tabInfo"
      :index="nowIndex"
    ></HeaderTab>
    <swiper
      @slide-change-transition-end="handleClickSlide"
      class="swiper"
      id="swiper"
      ref="mySwiper"
      :options="swiperOptions"
    >
      <swiper-slide>
        <TaskList :index="1" state="pending"></TaskList>
      </swiper-slide>
      <swiper-slide>
        <TaskList :index="2" state="processing"></TaskList>
      </swiper-slide>
      <swiper-slide>
        <TaskList :index="3" state="finish"></TaskList>
      </swiper-slide>
      <div class="swiper-pagination" slot="pagination"></div>
    </swiper>

methods: {
    handleClickSlide() {
      console.log(this.nowIndex);
      this.nowIndex = this.swiper.activeIndex;
    },
    getNowIndex(data) {
      console.log("Current Swiper instance object", data);
      // this.swiper.slideTo(3, 1000, false)
      this.nowIndex = data;
      this.swiper.slideTo(data, 1000, false);
    },
  },