在Vue中公共组件仅在某些页面显示

解决公共组件仅仅在某些页面显示

方法之一就是

运用 v-if="$route.meta.keepAlive"

例如底部公共组件
写在app.js中`

 <div  v-if="$route.meta.keepAlive">
<div class="footer">
      <h4>版权信息 Copyright © 2021 - 10 - 9
        <br> Someone. All rights reserved.
        <br>Welcome!!!
      </h4>
    </div>
  </div>
<router-view v-if="!$route.meta.keepAlive"></router-view>

（可以在style里面进行定位到底部）

不想显示的login页面，在router/index.js 中

 {
      path: '/login',
      name: 'login',
      component: login,
      meta: {
        keepAlive: false
      }

想展示的home页面

  {
      path: '/home',
      name: 'home',
      component: home,
      meta: {
        keepAlive: ture
      }