How to redirect to another route

There are infinite reasons you may wish to redirect the user. You may want the user to log in before accessing a page, or maybe a page has moved and you want your user to take note of the new link. In this recipe, you will redirect the user to a new home page as a way to quickly modify the website.

Getting ready

This recipe will only use basic knowledge about vue-router. If you have completed the Creating a SPA with vue-router recipe, you are good to go.

How to do it…

Suppose that we have an online clothing shop.

This will be the HTML layout of the site:

<div id="app">
  <h1>Clothes for Humans</h1>
  <ul>
    <li><router-link to="/">Home</router-link></li>
    <li><router-link to="/clothes">Clothes</router-link></li>
  </ul>
  <router-view></router-view>
</div>

It's just a page with a link to a clothes listing.

Let's register the VueRouter:

Vue.use(VueRouter)

We have three...