JSFiddle - React, Tailwind, and code Playground

by Rahul Kadyan

HTML

<script src="https://unpkg.com/[email protected]/dist/vue.js"></script>
<script src="https://unpkg.com/[email protected]/dist/vue-router.js"></script>

<div id="app">
<router-link to="/">Home</router-link>
<router-link to="/login">Login</router-link>
<router-link to="/logout">Logout</router-link>
<router-view></router-view>
</div>

JavaScript

Vue.use(VueRouter)

const Home = { template: '<div><h2>HOME</h2></div>' }
const Login = { template: '<div><h2>LOGIN</h2></div>' }

const router = new VueRouter({
  routes: [
    {path: '/', component: Home},
    {path: '/login', component: Login},
    {path: '/logout',
      redirect: to => {
      console.log(to)
        console.log('redirect called on '+ new Date())
        return '/'
      }
    }
  ]
})

new Vue({
  el: '#app',
  router
})