vuexGetters总结

总结

getters

• 写法

• getters方法是和state同一级别的方法
• getters相当于一个计算属性

const store = new Vuex.Store({
    state:{
        user:{
            name: '',
            tel: '',
            id: '',
            sex: ''
        }
    },
    getters:{
        // 写getters的计算属性（函数）
        getUserId(state) {
            return state.user.id
        }
    }
})

• 在vue文件中使用
  第一种写法

<template>
    <div>{{$store.getters.getUserId}}</div>
</template>

    created() {
        console.log(this.$store.getters.getUserId)
    }

第二种写法

<template>
    <div>{{getUserId}}</div>
</template>

    import { mapGetters } from 'vuex'
    export default {
        data() {
            return {

            }
        },
        computed: {
            ...mapGetters([
                'getUserId'
            ])
        },
        created() {
            console.log(this.$store.getters.getUserId)
        }
    }
    

来源：CSDN

作者：BL_gui

链接：https://blog.csdn.net/BL_gui/article/details/103989888