vuex的5种状态

简介: vuex的5种状态

1、State(状态):Vuex 中存储应用程序状态的位置,所有的状态都存储在这个地方。State 是一个普通的 JavaScript 对象,包含了需要共享的数据。


2、Mutation(变更):状态只能通过 mutation 进行更改,它们是更改 Vuex store 中 state  唯一方法。


Mutation 是 Vuex 中更改 state 的函数,每个 Mutation 都有一个字符串类型的事件类型和一个回调函数。当一个  mutation 被触发时,相关的状态都会被更新。


3、Getter(获取器):计算 Vuex store 中的状态的属性,Getter 接收 state 作为第一个参数,可以接收其他 getter 作为第二个参数,它们都会返回计算后的值。


4、Action(动作):异步修改状态的操作,Action 可以包含任意异步操作,最后由 Mutation 去更改 state。


Action  通过调用一个或多个 Mutation 来更改 state。Action 可以包含任意异步操作,并且可以访问 Vuex state,getter  和其他 action。


5、Module(模块):将 VueX store 分割为多个模块化的一部分,每个模块都有自己的  state,mutation、action、getter。Vuex modules 允许我们将 state  分割成更小、更可组合的部分,使代码更易于维护。


每个模块可以具有属于自己的 state、mutation、action、getter


简单来说,State 存储数据,Mutation 更改数据,Getter 计算数据,Action 异步修改数据,Module 将 State、Mutation、Action、Getter 分割为模块,分模块开发更易于维护。

相关文章
|
JavaScript
vue路由导航守卫(全局守卫、路由独享守卫、组件内守卫)
vue路由导航守卫(全局守卫、路由独享守卫、组件内守卫)
585 0
|
6月前
|
JSON 监控 Java
日志与追踪的完美融合:OpenTelemetry MDC 实践指南
日志与追踪的完美融合:OpenTelemetry MDC 实践指南
388 24
|
8月前
|
JavaScript 前端开发 UED
PDF在线预览实现:如何使用vue-pdf-embed实现前端PDF在线阅读
本文详细介绍了如何在Vue项目中使用vue-pdf-embed实现PDF文件的在线展示。从项目初始化、插件集成到高级功能的实现和部署优化,希望对你有所帮助。在实际项目中,灵活运用这些技术可以大大提升用户体验和项目质量。 只有锻炼思维才能可持续地解决问题,只有思维才是真正值得学习和分享的核心要素。如果这篇博客能给您带来一点帮助,麻烦您点个赞支持一下,还可以收藏起来以备不时之需,有疑问和错误欢迎在评论区指出~
|
存储 Web App开发 JSON
存储界的cookie、本地存储、会话存储
存储界的cookie、本地存储、会话存储
559 0
|
10月前
|
存储 SQL 监控
Dynamic Table快速入门
本次分享的主题是Dynamic Table快速入门,由Hologres PD 梅酱分享。今天的分享分为三个部分。首先,第一部分为Table的基本概念;第二部分进行Table的实操;第三部分为一些使用Table的建议和最佳实践。
358 12
|
Web App开发 Go iOS开发
【IOS】教你如何在手机端轻松安装 ipa 文件 -(安装器已失效 21.10)|社区征文
【IOS】教你如何在手机端轻松安装 ipa 文件 -(安装器已失效 21.10)|社区征文
Px,em,rem的区别
【10月更文挑战第10天】 Px,em,rem的区别
998 2
|
安全 应用服务中间件 网络安全
部署SSL证书
部署SSL证书
926 5
|
前端开发 JavaScript 开发者
三大微前端框架,谁是你的理想型?
【7月更文挑战第4天】React、Vue和Angular在微前端领域表现出色,各具优势。React以其组件化和高效生态受青睐,Vue以简洁和渐进式设计赢得人心,Angular则凭借全面功能和类型系统脱颖而出。选择框架需考虑项目需求、团队技能及技术栈兼容性。例如,React组件可通过虚拟DOM高效管理状态,Vue组件易于集成,而Angular组件利用模块化和依赖注入支持独立部署,但学习成本较高。每个框架的组件示例展示了其在微前端中的应用潜力。最终选择无定论,关键在于适应性。
1292 2
|
前端开发 JavaScript
vue实战范例——箭头步骤条/导航(含css 斜切skew的妙用)
vue实战范例——箭头步骤条/导航(含css 斜切skew的妙用)
593 0
下一篇
开通oss服务