【Vue】vuex getters 配置项

本文介绍了Vuex中getters的使用,getters允许开发者对state中的数据进行加工处理,类似于全局计算属性。当需要进行复杂的计算且多个组件需要共享时,getters提供了一个优雅的解决方案。在store中定义getters函数,然后在组件中通过$store.getters访问。getters的使用方式与Vue中的data和computed相似,并能在开发者工具中查看。这样提高了代码的复用性和组织性。

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

  1. 概念:当state中的数据需要经过加工后再使用时,可以使用getters加工,相当于全局计算属性
  2. 在src/store/index.js中追加getters配置。
  3. 组件中读取数据 $store.getters.bigSum。

要点:

比如要简单的运算就直接写在了插值语句中

但是如果要进行一个麻烦的运算, 而且需要被好多组件复用, 就不太好了

而计算属性实现也只是在组件中能复用

我们这边就可以用 store 里面的一个全新配置项

getters 如下这么定义, 其中写入一个函数, return 里写的就是对 state 里数据进行复杂操作后的值

最后在配置到 store 里面

使用:

getters 就在 $store 里面

this.state.getters.bigSum

在模板中不需要写 this

不难发现这和我们 vue 中 data 和 computed 很像

而且开发者工具中也能看到

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值