2019-08-02 按需配置tab栏页面

2019-08-02  本文已影响0人  半眼鱼

1.首先在App.vue页面配置<router-view>的name属性

<template>
<div id="app">
  <keep-alive>
    <router-view class="view-router"  v-if="$route.meta.keepAlive"></router-view>
  </keep-alive>
  <router-view class="view-router" v-if="!$route.meta.keepAlive"></router-view>
  <router-view name="tabbar"></router-view>
</div>
</template>

2.然后在路由router.js配置默认指向和带名称指向

  {
    path: '/user',
    name: 'user',
    meta: {
      keepAlive: true
    },
    components: { default: tab_user, tabbar: Tabbar }
  },

3、效果就会实现相应的tab栏

上一篇下一篇

猜你喜欢

热点阅读