vuex-基础讲解

vuex-基础讲解
一.介绍
本人出入前端半年,接触过两个上线的项目。第一次写博客,决定用vuex来开头
二.解释什么是vuex
官方解释:
Vuex是Vue.js应用程序的状态管理模式+库。它充当应用程序中所有组件的集中存储,其规则确保状态只能以可预测的方式进行变更。它还与Vue的官方devtools扩展集成,以提供零配置时间旅行调试和状态快照导出/导入等高级功能。
我认为vuex就是一个大的仓库,方便我们管理。在store里面配置了全局都可以随时调用然后对里面的值进行改变或者使用。
三.vuex包括什么
在一个具体的工程里面。1.我们可以在src文件下面建立一个store文件
2.在里面首先先建立一个index.js
vuex-基础讲解
在index.js里面创建这四个方法
四。具体讲解每个方法的用途
1.state是存需要管理的数据
let state={
userInfo: null,
saveUserInfo: null, //存你想要的数据我这里随便弄了两个做样子
}
这个时候就能在全局使用this.$state来调用数据了

2.mutation只有它可以改变state里面的值
const mutation={
SET_userInfo(state, result) {
state.userInfo = result
},
// 保存用户信息
SET_saveUserInfo(state, result) {
state.saveUserInfo = result
},
}
3.action是业务处理 可以做逻辑上的运算
vuex-基础讲解
4.geteer 是对state里面的数据进行监视
五.如何在vue里面使用vuex
在vue里面如果需要存数据则可以这样
this.store.commit(SETquestionList,res.data.result)mutationawaitthis.store.commit('SET_questionList', res.data.result) 第一个参数为自己mutation里面定义的 第二个参数为当前想让第一个参数改变的值,就是自己想传去的值。 await this.store.dispatch(‘submitQuestionnaire’, {}
await 为异步获取数据 第一个参数为获取的接口,然后在{}在里面输入你想提取的数据。

第一次写感觉写的不好 ,先写这么多吧。等两天重新更新