vant中tab使用组件，并且手势滑动

因为要使用tab页切换组件，只能使用name匹配
而vant中的tab手势滑动又必须是索引值才生效
一直以为：鱼与熊掌不能兼得，直到今天！！！
（￣︶￣）↗　
以前的代码

<van-tabs v-model="tabName" swipeable title-active-color="#0084FF" color="#0084FF">
      <van-tab name="classIntroduction" title="课程介绍"></van-tab>
      <van-tab name="classList" title="听课列表"></van-tab>
</van-tabs>
<transition name="component-fade" mode="out-in">
      <keep-alive>
        <component v-bind:is="tabName"></component>
    </keep-alive>
</transition>

解决后的代码

<van-tabs v-model="active" swipeable animated>
      <van-tab v-for="(item, index) in arr" :title="item.title" :key="index">
        <all v-if="(active == 0)" ></all>
        <completed v-if="(active == 1)" />
        <undone v-if="(active == 2)" />
        <connected v-if="active==3" />
        <notContacted v-if="active==4"/>
      </van-tab>
</van-tabs>

组件切换+手势滑动完美(●’◡’●)