移动端tabbar隐藏方案

移动端自定义tabbar在有些页面中需要隐藏

有以下两种方案

方案一：设置组件隐藏显示

    <!-- 父组件 -->
    <tab-bar v-show="!hideTabBar"></tab-bar>


    <!-- 路由文件 -->
    {
      path: "/search",
      component: () => import("../views/search/index.vue"),
      meta: {
        hideTabBar: true, // 是否隐藏首页的tabbar; 默认为 false
      },
    },

方案二：修改样式，遮盖tabbar

  <div class="city">
    <div class="top">
    </div>
    <div class="content">
    </div>
  </div>


.city {
  position: relative;
  z-index: 9;
  height: 100vh;
  background-color: #fff;
  overflow-y: scroll;
}