Vue vueRouter的基本使用

一、Vue Router的基本使用

1、安装vue-router插件

npm install vue-router --save 1

链接：Vue Router文档

2、创建路由实例

import Vue from 'vue'
import VueRouter from 'vue-router'
import listTemplate from '@/view/demo/listTemplate.vue'

Vue.use(VueRouter)

const routes = [
  {
    path: '/demo',
    component: listTemplate
  }
]

const router = new VueRouter({
  routes
})

export default router

3.挂载到vue上

import Vue from 'vue'
import App from './App'
import router from '@/router/index'
Vue.use(ElementUI)

Vue.config.productionTip = false

/* eslint-disable no-new */
new Vue({
  el: '#app',
  components: { App },
  router,
  template: '<App/>'
})

4、使用路由