vant Tabbar 标签栏跳转二级页面时隐藏标签栏

如何使用vant就不描述了，大家肯定会的，简单点咯，直接上代码

首先在router路由里定义好标签栏要使用的路由页面，然后再里面添加：meta:{showTab:true}，作为标识符，路由有携带此标识符才显示Tabbar标签栏

import Vue from 'vue'
import VueRouter from 'vue-router'
import HomeView from '../views/HomeView.vue'

Vue.use(VueRouter)

const routes = [
  {
    path: '/',
    name: 'home',
    component: HomeView,
    meta: {
      showTab: true
    }
  },
  {
    path: '/about',
    name: 'about',
    
    component: () => import( '../views/AboutView.vue'),
    meta: {
      showTab: true
    }
  },
  {
    path: '/Information',
    name: 'Information',
    component: () => import( '../Information/Information.vue'),
    meta: {
      showTab: true
    }
  },
]

写好后，在App.vue里使用Tabbar 标签栏，在van-tabbar标签里添加v-if判断路由是否携带了标识符

<template>
  <div id="app">
    <van-tabbar v-model="active" route v-if="$route.meta.showTab">
      <van-tabbar-item icon="wap-home-o" to="/">首页</van-tabbar-item>
      <van-tabbar-item icon="smile-o" to="/about">服务办理</van-tabbar-item>
      <van-tabbar-item icon="chat-o" to="/Information"
        >资讯信息</van-tabbar-item
      >
      <van-tabbar-item icon="contact">我的</van-tabbar-item>
    </van-tabbar>
    <router-view />
  </div>
</template>

<script>
export default {
  data() {
    return {
      active: 0,//默认是第一个
    };
  },
};
</script>