vue学习（十二）vue全家桶 Vue-router&Vuex

一 vue-router的基本使用

 

 

一 vue-router的基本使用

// router/index.js                  与直接生成的此文件有些不一样// 1. 导入
import Vue from 'vue'
import VueRouter from 'vue-router'
import Home from '../views/Home.vue'
import About from '../views/About.vue'
// 2.模块化机制 使用
Vue.use(VueRouter)

// 3. 创建路由器对象
export default new VueRouter ({
    routes: [

  {
    path: '/',
    name: 'home',
    component: Home
  },
  {
    path: '/about',
    name: 'about',
    component: About
  }
]
})

// main.js import Vue from 'vue'
import App from './App.vue'
import router from './router'

Vue.config.productionTip = false

// 4 在main.js中挂载 router
new Vue({
  router,
  render: h => h(App)
}).$mount('#app')

 

 

来源：https://www.cnblogs.com/a438842265/p/11996081.html