mapState与mapGetters语法糖

vuex中的 mapState,mapGetters 属于辅助函数,其实就是vuex的一个语法糖,使代码更简洁更优雅。

<script>
import {
    
     mapState, mapGetters } from "vuex"
export default {
    
    
    computed: {
    
    
    	//原先state中的数据
        templateInfo(){
    
    
        	return this.$store.state.templateInfo
        },
        //现在
        ...mapState([
            "templateInfo",   
        ]),
        //原先getters中的数据
        isPreview(){
    
    
        	return this.$store.getters.isPreview
        },
        //现在
        ...mapGetters([
            'isPreview'
        ])
    },
    created(){
    
    
     	//使用时
     	this.templateInfo,
     	this.isPreview
	}
}
</script>

mapState与mapGetters只能在computed中使用,与正常的computed中的函数一起使用时需要用扩展运算符,然后在mapState或mapGetters函数的数组中放入对应的state或getters中的名称。

猜你喜欢

转载自blog.csdn.net/m0_48076809/article/details/109756350
今日推荐