URL重定向

知识点

  • 重定向指令:redirect
  • 路由别名:alias

实战演习

  • About.vue
  • router/index.js
  • App.vue

About.vue

  1. <template>
  2. <div>
  3. <h1>About Page</h1>
  4. </div>
  5. </template>

router/index.js

  1. import About from '@/components/About'
  2. ...
  3. {
  4. path: '/about',
  5. name: 'About',
  6. component: About,
  7. alias: '/aboutme'
  8. },
  9. {
  10. path: '/curry',
  11. redirect: '/player/1'
  12. //redirect: { name: 'About' }
  13. //redirect: '/about'
  14. }

App.vue

  1. <template>
  2. <div id="app">
  3. <router-link to="/">Home</router-link>
  4. <router-link to="/about">About</router-link>
  5. <router-link to="/player/1">Player1</router-link>
  6. <router-link to="/curry">Curry</router-link>
  7. <hr>
  8. <router-view></router-view>
  9. </div>
  10. </template>

课程文件

https://gitee.com/komavideo/LearnVueJS2

小马视频频道

http://komavideo.com