vue 命名路由跳转

原文链接: vue 命名路由跳转

上一篇: js 数值每三位加逗号和反转字符串

下一篇: vue 动态路由

使用命名路由进行跳转

路由跳转两种方式

1，path，需要一个字符串，表示跳转url

    <router-link to="/movie">movie</router-link>

2，name，需要传递一个对象，所以必须使用:to的形式

    <router-link :to="{name:'Movie'}">movie</router-link>

推荐使用name，因为路径有可能会改变，如果使用path写死的话，再次修改会很麻烦，使用name修改路径就不需要再次修改router-link

name默认名称与组件名称一致

router

export default new Router({
  routes: [
    {
      path: '/movie',
      name: 'Movie',
      component: Movie,
    },
    {
      path: '/review',
      name: 'Review',
      component: Review
    }
  ]
})

App

  <div id="app">
    <router-link :to="{name:'movie'}">movie</router-link>
    <router-link :to="{name:'Review'}">review</router-link>
    <router-view/>
  </div>