vue-router列表详情按钮跳转

Question

列表详情按钮，点击后整个页面跳转至详情页面（顶部logo不变，spa页面），这个该怎么做？

详情按钮代码：

<p class="linkDetail"><router-link :to="'/top250/'+list.id">详情</router-link></p>

vue-router代码：

{
  path: '/top250',
  name: 'top250',
  component: Top250,
  children: [
    {
      path: '/top250/:id',
      component: DetaiMovie
    }
  ]
},

Answer 1

vue-router文档

{
  path: '/top250',
  name: 'top250',
  component: Top250
},{
    path: '/DetaiMovie',
    name: 'DetaiMovie',
    component: DetaiMovie
}

<p class="linkDetail"><router-link :to="{ name: 'DetaiMovie', params: { id: 123 }}">详情</router-link></p>

Answer 2

如果想要nav不变的话、就用路由嵌套、最外层导航根据vuex取title、中间内容切换

Answer 3

我做的功能和你的一样，但是为什么我的会报错呢？提示
Unknown custom element: <router-link> - did you register the component correctly? For recursive components, make sure to provide the "name" option.