vue列表进入详情页面时，详情页会显示列表页加上详情页的内容。

Question

路由： 新闻页下面嵌套着一个新闻详情页

{
  path: '/news',
  name: 'news',
  component: news,
  meta: {
    title: '最新资讯'
  },
  children: [  //这里就是二级路由的配置
      {
        path: '/news/newsDetail',
        name: 'newsDetail',
        component: newsDetail,
        meta: {
          title: '9最新资讯详情'
        }      
      }
    ]
},

组件的内容
<router-link class="item" :to="{path:'/news/newsDetail'}" v-for='(item, index) in news.con' :key='index'>
</router-link>

<router-view></router-view>

因为我想实现新闻详情页的导航有高亮效果，现在可以进入详情页，发现详情页内页包含着列表页的内容

Answer 1

路由：新闻列表和详情变成同级

{
  path: '/news',
  name: 'news',
  component: news,
  meta: {
    title: '最新资讯'
  }
}, 
{
  path: '/news/newsDetail',
  name: 'newsDetail',
  component: newsDetail,
  meta: {
    title: '最新资讯详情'
  }      
},

列表页：

    <router-link class="item" :to="{path:'/news/newsDetail',query:{ tit:item['brand'], date:item['date'], active: anchor.tit1}}" v-for='(item, index) in news.con' :key='index'>  
    </router-link>

最后再导航链接上去掉exact属性，之前没有去掉，导致页面进入新闻详情导航不高亮。

最后真的很谢谢你们啊，感谢你们的奉献给我前进的动力。

（2019.3.5）回答 沁冷月 的问题：

我的路由文件里面配置了linkActiveClass:'active',  
然后在css里面设置active为导航栏高亮的类，(比如.active {background: red},导航高亮的类为红色)
https://router.vuejs.org/zh/api/#linkactiveclass(官网链接)。
希望能帮到你，加油

Answer 2

你这路由嵌套写法就是展现出来问题的情况，如果不想出现这种情况，可以不用嵌套路由就解决了，对于路由这一块可以多看下文档，文档里都已经写清楚了。

Answer 3

列表与详情配置为平级的路由，至少不能是父子