vuex

最新推荐文章于 2024-09-22 18:59:52 发布

那不是我的月亮a

最新推荐文章于 2024-09-22 18:59:52 发布

阅读量191

点赞数

CC 4.0 BY-SA版权

分类专栏： vue

本文链接：https://blog.youkuaiyun.com/yanwu9537/article/details/91376956

vue 专栏收录该内容

8 篇文章

订阅专栏

本文深入探讨Vuex作为Vue.js的状态管理模式，适用于中大型应用的集中式数据管理。解析了Vuex的工作流程，包括组件如何通过dispatch调用actions，进而触发mutations更新state，以及getter的使用方式。同时，介绍了如何利用mapActions、mapMutations和mapGetters简化操作。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

状态管理(vuex) store（集中式的存储管理）

什么时候用：打算开发中大型应用

集中式数据管理, 一处修改，多处使用

思维流程:
store.js
this. $s t o r e . c o m m i t (^{'} i n c r e m e n t^{'}) - > m u t a t i o n s t h i s .$ store.dispatch(‘jia’) -> actions
mapActions() ->actions mapGetters()->getters

      学生          代课老师         校长           财务      班主任             学生

(view）component - dispatch > action -> mutation -> state <- getter <- component
发送请求处理修改状态
业务逻辑修改state 读取state
异步

###1. 什么是状态

我们使用一条数据去管理一个视图，那么这个数据我们就称之为 ‘状态’

###2. vuex是做什么的？

Vuex是一个集中式的存储管理中心，vuex中可以用来存储数据（状态）

vuex也是一个状态管理中心，它也可以进行状态的管理

###3. 什么是状态管理模式？

我们使用一条数据去管理一个视图，那么这种管理模式就称之为状态管理

###4. 什么时候使用vuex
中大型应用使用（使用的时间）
###5. vuex的开发流程

四个方案：

1. 前： 标准    后： 标准  √

2. 前： 标准    后： 非标准  √

3. 前:  非标准  后： 非标准  √

4. 前： 非标准  后： 标准  √

component ---dispatch---> actions ---commit--->mutations---state <----getters----component

###6. 解决了三个工具 mapActions mapMutations mapGetters

export default 默认导出一个

export 叫批量导出，可以导出多个