Vue-router

Ссылки

• https://router.vuejs.org/ru/ -  официальная документация
• Vue HTML5 History Mode

Установка

npm install vue-router --save

Регистрируем плагин во vue

var Vue = require('vue')
import VueRouter from 'vue-router'
Vue.use(VueRouter)

Дальше для работы роутера - нужно создать экземпляр и передать в него список страниц.

var router = new VueRouter({
  routes: [
    { path: '/about', component: about },
    { path: '/contact', component: contact }
  ]
})

Сами страницы подгружаем через require

var about = require('./views/about.vue')
var contact = require('./views/contact.vue')

Для отображения на странице используем

<router-view></router-view>

Для создания навигации можно использовать компонент router-link. Этот компонет сам строит пути и помечает активные ссылки.

<router-link to="/contact">+ Контакты</router-link>