关于vuex

vuex

1. 什么是vuex?

vuex我们可以解决组件之间数据共享的问题，后期也方便我们管理以及维护，它由五部分组成：分别是：state，actions，mutations，getters，modules

2. vuex由五部分组成

• state: 存放状态
• actions：可以包含异步操作
• mutations ：是唯一可以修改state的状态
• getters ：类似于vue组件的计算属性，对state数据进行计算（会被缓存）
• modules：模块化管理store（仓库），

3. vuex的基本使用:

我通过是在根目录下新建一个store文件夹，里面创建一个index.js文件，最后在main.js中引入，并挂载到实例上，之后那个组件中需要用到vuex就调用就行

4. vuex中的数据持久化

就是为了解决刷新页面数据不丢失，才有了数据持久化
解决办法： 存放在localStorage或者sessionStorage里面，进入页面时判断是否丢失，丢失再去localStorage或者sessionStorage里面取；
在vuex中可以通过安装vuex-persistedstate 插件，进行持久化的配置就行

安装

cnpm install vuex-persistedstate -s
备注
-S是 --save 的简写，意为：把插件安装到dependencies(生产环境依赖)中
-D是 --save--dev 的简写，意为：把插件安装到devDependencies(开发环境依赖)中
使用

import persist from 'vuex-persistedstate'
const store = new vuex.Store({
state,
mutations,
actions,
getters,
plugins:[
	persist()
	]
})

5.辅助函数

1. 辅助函数有4个分别是：mapState ,mapActions , mapMutations ,mapGetters
2. 辅助函数可以把vuex中的数据和方法映射到vue组件中。达到简化操作的目的
3. 如何使用：

import { mapActions, mapGetters, mapMutations, mapState } from 'vuex'