Vuex 是什么?
Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式。它采用集中式存储管理应用的所有组件的状态,并以相应的规则保证状态以一种可预测的方式发生变化。Vuex 也集成到 Vue 的官方调试工具 devtools extension,提供了诸如零配置的 time-travel 调试、状态快照导入导出等高级调试功能。(官方文档说明)
Vuex通俗说就是组件间数据之间的共享。
首先安装vuex
直接使用npm安装 npm install vuex或者直接到页面引入vuex.js文件。
建立store.js文件(命名可以随便取)
新的的store.js文件里面创建 state-储存状态 、Mutation-更改 Vuex 的 store 中的状态的方法、Action-提交的是 mutation
设置好这些东西后你就可以到任何组件里面调用相应的方法
多个状态获取
引入vuex使用mapstate
组件里面分发Action
你在组件中使用 this.$store.dispatch('xxx') 分发 action,或者使用 mapActions 辅助函数将组件的 methods 映射为 store.dispatch 调用(需要先在根节点注入 store):