vviictrl
3/20/2018 - 6:12 PM

[simple vue router] #js #vue #javascript

[simple vue router] #js #vue #javascript

simple vue router
content_copyfile_download
<html>

<script src="https://cdn.jsdelivr.net/npm/vue@2.5.16/dist/vue.js"></script>

<div id="app">
  <router-link to="/">home</router-link>
  <router-link to="/about">about</router-link>
  <router-link to="/something">no route</router-link>
  <router-view></router-view>
</div>



<script>


const NotfoundComponent = {
	template: '<h1>Not found</h1>'
};

const HomeComponent = {
	template: '<h1>Home</h1>'
};

const AboutComponent = {
	template: '<h1>About</h1>'
};

const routes = [
	{
  	path: '/',
  	component: HomeComponent
  },
  {
  	path: '/about',
  	component: AboutComponent
  },
  {
  	path: '*',
    component: NotfoundComponent
  }
];

const router = new VueRouter({
	routes
});

new Vue({
	el: '#app',
	router
});
</script>


</html>