(待议-有问题)vuex 中state数据更新后,常规的属性调用 getter 读取state的值不更新 的解决

⭐(特级)vuex 中state数据更新后,常规的属性调用 getter 读取state的值不更新 的解决

官方文档 vuex getters 通过方法访问
要结合情景来看 vuex getters(组件mounted调用)使用注意

  • 一般情况下,getters(作用类似computed)通过属性来访问!!
  • !!!此请况可以通过 方法来访问(实现调用getters方法时,每次调用都是调用方法,数据就会重新调用)!!!

例子

vuex文件写入

state: {
    // commdityData数据会由mutations的方法进行更新
    commdityData:{}
},
getters:{
    // 第一个参数是state
    // 写入一个箭头函数
    cateNav:(state) => () =>{ return state.commdityData.categoryView },    
}

组件调用(方式都是默认使用vuex模块的)

方式一: 使用辅助函数
import{createNamespacedHelpers} from 'vuex'
const{mapGetters:detailMapGetters} = createNamespacedHelpers('detail')

export default{
  methods:{
    ...detailMapGetters(['cateNav'])
  }
  mounted(){
    this.cateNav()
  }
}
方式二 :
import{mapGetters} from 'vuex'
export default{
  methods:{
    // ...mapGetters('模块名',['getters方法名'])
    ...mapGetters('detail',['cateNav'])
  }
  mounted(){
    this.cateNav()
  }
}
  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值