vue-router中元信息meta可以用來(lái)區(qū)分哪些頁(yè)面是需要顯示底部導(dǎo)航欄的肌毅。
在需要顯示底部導(dǎo)航欄的頁(yè)面的路由上掛載meta元信息,這樣在父組件里的tabbar就可以用v-if判斷是否展示底部導(dǎo)航欄了蔚万。
路由部分代碼:
{
path: "/topic",
name: "Topic",
meta: {
isShowtabbar: true,
},
component: () =>
import(/* webpackChunkName: "Cart" */ "../views/Topic.vue"),
},
{
path: "/cart",
name: "Cart",
meta: {
isShowtabbar: true,
},
component: () => import(/* webpackChunkName: "Cart" */ "../views/Cart.vue"),
},
底部導(dǎo)航欄的父組件部分代碼:
<template>
<div id="app">
<router-view />
<tabbar v-if="$route.meta.isShowtabbar"></tabbar>//tabbar為子組件底部導(dǎo)航欄
</div>
</template>