Vue 之vue-router + vue-resource + vuex

npm install vue-router --save  

npm install vue-resource --save  

npm install vuex --save  

一、代码

 

import Vue from 'vue'
import App from './App.vue'
import VueRouter from 'vue-router'
import VueResource from 'vue-resource'
import Vuex from 'vuex'

Vue.use(VueResource)
Vue.use(VueRouter)
Vue.use(Vuex)

//路由配置
const routes = [
  {
    path: '/',
    name: 'Home',
    component: () => import('./components/Home.vue'),
    meta: {
        title: '首页'
    }
  },
  {
    path: '/about',
    name: 'About',
    component: () => import('./components/About.vue'),
    meta: {
        title: '关于'
    }
  }
]
const router = new VueRouter({
  base: './',
  mode: 'hash',
  routes
})
router.beforeEach(function(to, froms, next){
    if(to.meta.title){
        document.title = to.meta.title
    }
    next()
})

//全局存储配置
const store = new Vuex.Store({
  state: {
    count: 0
  },
  mutations: {
    increment (state) {
      state.count++
    }
  }
})

Vue.config.productionTip = false

new Vue({
    router,
    store,
    render: h => h(App),
}).$mount('#app')

二、文档

vue-router：https://router.vuejs.org/zh/installation.html

vue-resource：https://www.cnblogs.com/goloving/p/8665421.html

vuex：https://vuex.vuejs.org/zh/