子組件
一惑灵、什么時候需要使用輔助函數(shù)
當(dāng)一個組件需要獲取多個狀態(tài)的時候,使用方式會有些重復(fù)和冗余眼耀。為了解決這個問題英支,我們可以使用輔助函數(shù)來簡化使用方式,讓我們少按幾次鍵
二哮伟、按需引入四個輔助函數(shù)
import { mapState,mapGetters,mapActions,mapMutations } from "vuex";
三干花、輔助函數(shù)的位置
mapState,mapGetters在computed中使用,而且在所有自定義計算屬性的上方
mapActions,mapMutations在methods中使用楞黄,而且在所有方法的上方
四池凄、示例:
export default {
name: "index",
computed: {
...mapState(['msg','goodsList' ]),
...mapGetters([ 'goodScore']),
//自定義計算屬性
getDate(){
return Date.now()
}
},
methods: {
...mapActions([ 'getGoodsList']),
...mapMutations(['changeMsg' ]),
change(){
this.changeMsg('1')
}
}
}
五、使用輔助函數(shù)后谅辣,再訪問store數(shù)據(jù)修赞,直接調(diào)用實例自身的變量即可
以前: this.$store.state.msg
現(xiàn)在: this.msg
以前: this.$store.commit("方法名")
現(xiàn)在: this.方法名()