移动端tarbar导航显示与隐藏的方式

tarbar的是显示和隐藏我们可以使用vuex和路由来控制，使用watch来是监听当前路由是否包含某个路径，如果包含则显示，把vuex中的state属性设置为true，然后在当前页面使用computerd和getters来观察路由中state属性的变化，并使用if来判断是否显示tarbar
代码如下
vuex文件

state: {
    updateTabbarShow: false
  },
  mutations: {
    updateTabbarShow(state, n) {
      state.updateTabbarShow = n;
      console.log(state.updateTabbarShow);
    }
  },
  getters: {
    getTabbarShow(state) {
      return state.updateTabbarShow;
    }
  },

app.vue文件

watch: {
    $route(to, from) {
      //判断是否显示tabbar
      if (to.path == "/" || to.path == "/home" || to.path == "/index") {
        this.$store.commit("updateTabbarShow", true);
      } else {
        this.$store.commit("updateTabbarShow", false);
      }
    }
  }, computed: {
    tabbarShow(){
      return this.$store.getters.getTabbarShow
    }
  },

template文件内容

   <Tabbarmain v-if="tabbarShow"></Tabbarmain>