命名路由的使用

最新推荐文章于 2024-07-04 16:52:52 发布

都挺好，刚刚好

最新推荐文章于 2024-07-04 16:52:52 发布

阅读量187

点赞数

分类专栏： vue-router 文章标签： javascript 前端 vue.js

本文链接：https://blog.csdn.net/seimeii/article/details/127220411

版权

vue-router 专栏收录该内容

20 篇文章 1 订阅

订阅专栏

使用命名路由进行跳转

路由跳转两种方式

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>