vue路由，父子路由跳转，父页面隐藏

最新推荐文章于 2024-07-02 11:14:53 发布

森林的尽头是阳光

最新推荐文章于 2024-07-02 11:14:53 发布

阅读量5.5k

点赞数 8

分类专栏： vue项目中常见问题文章标签： vue.js

本文链接：https://blog.csdn.net/sinat_41904410/article/details/123821196

版权

vue项目中常见问题专栏收录该内容

10 篇文章 1 订阅

订阅专栏

1. 路由配置

子路由的path不要加/
showfater用于显示隐藏父路由内容

{
  path:"/index",
  component:Index,
  name:"index",
  children:[
    path:"child",
    component: Child,
    name:"child",
    meta:{
       showfater: false
    }
  ],
  meta:{
     showfater: true
  }
}

2. 父路由页面

要写router-view来显示子组件
在需要隐藏的父内容中使用$ route. meta.showfater来显示隐藏
跳转 this.$ router.push({name:" child"})

<template>
<div>
  <div v-show="$route.meta.showfater">父路由内容</div>
  <router-view></router-view>
</div>
</template>


this.$router.push({name:"child"})