Vue状态管理之Vuex

作者：@skyflask
转载本文请注明出处：https://www.cnblogs.com/skyflask/p/10907432.html

---

目录

 

state：既然vuex是用来储存数据的，那么我们的储存地点就是这里。

render: 页面渲染

vue commponents: 页面的组件，比如输入值时

dispatch：组件分发给acitons

actions：专门用来提交mutations的，处理异步操作。它执行axios，请求后端服务器。拿到数据后，执行commit

mutations：对数据的处理都是在这里进行，处理同步操作。拿到axios的返回数据后，更新state

devtools: vue-devtools是一款基于chrome游览器的插件，用于调试vue应用

mutate：state数据变化后，页面执行render，开始重新渲染。

 

所以总的来说就是建立一个state，然后调用actions来提交mutations处理state中的数据，最后用getters得到state中的数据。

至于为什么要用actions来提交mutations处理state中的数据，原因是mutation 必须是同步函数，所以通过actions来调用mutations

state-->render-->vue components-->dispatch-->actions-->backend api-->commit-->mutations-->mutate
-->state-->render....