vue-router和vuex的安装

在vue-cli中两个的安装都是一样的

下载：npm i vuex  vue-router

安装：

1.注册:  如果在一个模块化工程中使用它，必须要通过 Vue.use() 明确地安装路由功能：

import Vue from ‘vue‘
import VueRouter from ‘vue-router‘
import Vuex from ‘vuex‘

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

2.new一个对象

3，为了在 Vue 组件中访问 this.$store property，你需要为 Vue 实例提供创建好的 store。

Vuex 提供了一个从根组件向所有子组件，以 store 选项的方式“注入”该 store 的机制：

也可以通过this.$store.state.count来获取数据

通过注入路由器，我们可以在任何组件内通过 this.$router 访问路由器，也可以通过 this.$route 访问当前路由：

import store from ‘./store‘;
import router from ‘./router‘

new Vue({
  el: ‘#app‘,
　router: router,  store: store,
})
mutation：突变，变异。

为什么要由mutation，是因为要对state，也就是状态的变化，进行监控。

在组件中不能随意直接更改state，这样直接改的状态监控不到，要把改变state的所有方法固定下来，全部放到store的mutation中，这是改变状态的唯一途径。

mutations的参数：

• statte：状态，
• payload：负荷

触发:

用$store.commit（‘mutation名称‘，payload）

mutations里的操作，严禁由异步代码，比如网络请求，定时器，promise，因为函数执行完就被记录，后来的异步代码执行过程不会被记录到。

actions

专门处理异步代码的，异步中commit，然后达到改变state的目的

因为actions是异步的，所以没法记录，只能记录mutation

第一个参数是ctx，表示当前的store

actions触发用dispatch，$store.dispathc(‘action名称‘，payload)，返回值是promise

vue-router和vuex的安装

原文：https://www.cnblogs.com/dangdanghepingping/p/14854997.html