编程开源技术交流,分享技术与知识

网站首页 > 开源技术 正文

Vuex状态管理简单使用方法(vuex的状态)

wxchong 2024-08-04 02:45:00 开源技术 78 ℃ 0 评论

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

设置好这些东西后你就可以到任何组件里面调用相应的方法

多个状态获取

组件里面分发Action

你在组件中使用 this.$store.dispatch('xxx') 分发 action,或者使用 mapActions 辅助函数将组件的 methods 映射为 store.dispatch 调用(需要先在根节点注入 store):

Tags:

本文暂时没有评论,来添加一个吧(●'◡'●)

欢迎 发表评论:

最近发表
标签列表