vuex有哪几种属性?

简介: vuex 是 Vue 配套的 公共数据管理工具,它可以把一些共享的数据,保存到 vuex 中,方便整个程序中的任何组件直接获取或修改我们的公共数据。

vuex是什么?

vuex 是 Vue 配套的 公共数据管理工具,它可以把一些共享的数据,保存到 vuex 中,方便整个程序中的任何组件直接获取或修改我们的公共数据。

注意点: 只有需要共享的才放到vuex上, 不需要共享的数据依然放到组件自身的data上。


State

State仓库,vuex使用单一状态树,每一个应用最好仅包含一个store实例,不建议直接修改state的值,最好是通过commit方法调用mutation任务进行修改,方便后期数据的追踪;


主要特点:

  1. 一个页面只能有一个state
  2. 状态存储是响应式的
  3. 不能直接改变 state 中的状态,唯一途径显式地提交mutations

Getter

你可以理解它是一个状态计算属性,好比组件里面的computed属性,所以getter 的返回值也会根据它的依赖被缓存起来,且只有当它的依赖值发生了改变才会被重新计算,说白了就是对 store 中的 state 做了一层封装,getter 可以接受两个参数,第一个是状态state,第二个参数是其他getter !

Mutation

Mutations,定义方法动态修改state中的数据,不建议包含逻辑业务处理,处理一些同步任务;

更改 Vuex 的 state 中的状态的唯一方法是提交 mutation。回调函数可以接受两个参数,第一个参数是state状态,第二个参数是 mutation 的载荷就是外面store.commit 传入额外的参数。

Actions

Actions,定义方法执行异步任务一些复杂的逻辑代码,view层通过store.dispath分发Action任务;


主要特点:

  1. Action 提交的是 mutation,而不是直接变更状态。
  2. Action 可以包含任意异步操作。

Module

Module,项目特别复杂的时候使用,每一个模块拥有自己的state,mutation,Action,getter,代码逻辑更加清晰;


模块的命名空间


如果把所有的状态都放在一个 store 对象里面,当应用变得非常复杂时,store对象就有可能变得相当臃肿,维护起来也会变得相当复杂,所以我们可以用模块来划分。比如A module,B module, 在项目中很有可能Amodule内部的 action、mutation 和 getter 可能和B module内部的 action、mutation 和getter方法名定义一样,但是这些方法又都是全局的,那么假如提交一次 mutation,A module 和 B module 的mutation 都会执行,这肯定不行,所以可以用模块的命名空间来区分,可以通过添加 namespaced: true的方式使其成为带命名空间的模块。

相关文章
|
5天前
|
云安全 人工智能 安全
AI被攻击怎么办?
阿里云提供 AI 全栈安全能力,其中对网络攻击的主动识别、智能阻断与快速响应构成其核心防线,依托原生安全防护为客户筑牢免疫屏障。
|
14天前
|
域名解析 人工智能
【实操攻略】手把手教学,免费领取.CN域名
即日起至2025年12月31日,购买万小智AI建站或云·企业官网,每单可免费领1个.CN域名首年!跟我了解领取攻略吧~
|
9天前
|
安全 Java Android开发
深度解析 Android 崩溃捕获原理及从崩溃到归因的闭环实践
崩溃堆栈全是 a.b.c?Native 错误查不到行号?本文详解 Android 崩溃采集全链路原理,教你如何把“天书”变“说明书”。RUM SDK 已支持一键接入。
580 212
|
4天前
|
编解码 Linux 数据安全/隐私保护
教程分享免费视频压缩软件,免费视频压缩,视频压缩免费,附压缩方法及学习教程
教程分享免费视频压缩软件,免费视频压缩,视频压缩免费,附压缩方法及学习教程
233 138
|
存储 人工智能 监控
从代码生成到自主决策:打造一个Coding驱动的“自我编程”Agent
本文介绍了一种基于LLM的“自我编程”Agent系统,通过代码驱动实现复杂逻辑。该Agent以Python为执行引擎,结合Py4j实现Java与Python交互,支持多工具调用、记忆分层与上下文工程,具备感知、认知、表达、自我评估等能力模块,目标是打造可进化的“1.5线”智能助手。
814 59
|
7天前
|
人工智能 移动开发 自然语言处理
2025最新HTML静态网页制作工具推荐:10款免费在线生成器小白也能5分钟上手
晓猛团队精选2025年10款真正免费、无需编程的在线HTML建站工具,涵盖AI生成、拖拽编辑、设计稿转代码等多种类型,均支持浏览器直接使用、快速出图与文件导出,特别适合零基础用户快速搭建个人网站、落地页或企业官网。
1149 157
|
6天前
|
存储 安全 固态存储
四款WIN PE工具,都可以实现U盘安装教程
Windows PE是基于NT内核的轻量系统,用于系统安装、分区管理及故障修复。本文推荐多款PE制作工具,支持U盘启动,兼容UEFI/Legacy模式,具备备份还原、驱动识别等功能,操作简便,适合新旧电脑维护使用。
487 109