【无标题】

本文介绍了在uni-app项目中如何使用Vuex进行状态管理,包括集中式存储、mutations、actions、getters以及模块化的应用,以实现组件间的共享数据和同步/异步操作的清晰划分。
摘要由CSDN通过智能技术生成

搭建仓库

搭建仓库的目的是:请求返回的首页数据,需要被多个组件共享使用,要么组件通信或者使用vuex集中管理数据

采用第二种方法:使用vuex集中管理数据

js 文件引入 | uni-app官网

在客户端项目中右击打开使用命令行窗口打开所在目录

npm init -y

npm i vuex@3.6.2 -S

生成package.json文件和node_modules文件夹

Vuex

作用:

1、集中式管理状态

2、多个组件之间共享数据

核心:

1、state存储状态

2、mutations:每个都是方法,同步修改state数据   注意:可以异步修改,但是在vuex调试工具里是看不到数据变化的。

3、actions:每个都是方法,异步修改state数据。同步触发mutations

4、getters:对state已有的数据加工处理,返回计算属性

5、module:分模块管理

引入vuex基本结构

在客户端项目右击新建目录store,在store目录下新建index.js文件

在store右击新建modules目录,在modules目录下新建home.js文件

且在index.js文件中引入

        import home from '../store/modules/home.js'

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值