vuex的使用之mapGetters

vue项目中,经常会使用到vuex,vuex是vue的一个状态管理。

本文简单总结一下:vuex中mapGetters的使用。

如果一个变量或对象需要在多个页面和组件中使用,那么,可以使用mapGetters。

一.vuex中声明变量个方法

1.在state中声明:

state: {
   freeShipping:cookie.get('freeShipping'),
}

2.在mutations中书写方法:


mutations: {
    updatefreeShipping(state, freeShipping) {
            state.freeShipping =freeShipping;
        },
 }
 

3.在getters中书写:


getters: {
    freeShipping: state => state.freeShipping || {}
}
  

二.在各页面中使用

1,引入

   import { mapGetters  } from "vuex";

2,在method同级上放入computed

computed: mapGetters(["freeShipping"]),

computed: {
               ...mapGetters(["freeShipping"])
          } ,

可放入多个对象

  computed: mapGetters(["userInfo","freeShipping"]),

3,页面变量取用

{{freeShipping.value}}
  • 3
    点赞
  • 14
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值