⭐(特级)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()
}
}