van-tabs教训

1、v-model一定要绑定数字，否则不生效

2、尽量用name值实现绑定

3、click事件能拿到索引，可以直接索引值

4、 ※※ van-tab上一定不要写v-if，否则van-tab加载不出来，索引会出现错误

案例实现功能

tab页切换展示，跳转页面时记录索引

<template>
    <div class="app">
         <van-tabs v-model="active" @click="tabClick">
           <van-tab title="志愿活动"  :name="0">
              <div v-if='list.length!=0' @click='toDetail'>xxxxxxx</div>
           </van-tab>
           <van-tab title="文化娱乐"  :name="1">
            <div v-if='list1.length!=0' @click='toDetail'>xxxxxxx</div>
           </van-tab>
         </van-tabs>
    </div>
<template>

export default {
    data () {
        return {
            activeName: sessionStorage.getItem('OldPeopleAllActivity'?Number(sessionStorage.getItem('OldPeopleAllActivity')) : 0,    
           }
       },
       
       mounted(){
        if (sessionStorage.getItem('OldPeopleAllActivity')) {
            this.activeName = Number(sessionStorage.getItem('OldPeopleAllActivity'))
            sessionStorage.removeItem('OldPeopleAllActivity')
        }
       },
       
       methods:{
          tabClick(index){
             console.log(index)
          },
          
          toDetail(){
              sessionStorage.setItem('OldPeopleAllActivity', this.activeName)
              this.$router.push({
                path: "./OldPeopleHappyDetail",
                query: {
                    id: item.activityId,
                    isFromOldPeopleDoActivity: 1,
                },
            });
          }
       },     
}