vuex二级获取，控制公共头部与尾部的展示和隐藏

login.js

 

export const state=()=>({

    headerShow:false,

    footShow:false

})

 

export const mutations={

    M_UPDATE_HEADSHOW(state,payload){

        state.headerShow=payload;

    },

    M_UPDATE_FOOTSHOW(state,payload){

        state.footShow=payload;

    }

}

 

export const actions={

    A_UPDATE_HEADSHOW({commit},payload){

        commit('M_UPDATE_HEADSHOW',payload);

    },

}

 

export const getters={

    getHeaderShow(state){

        console.log("状态");

        console.log(state);

        return state.headerShow;

    },

    getFootShow(state){

        return state.footShow;

    }

}

 

 

点击登录时

this.$store.dispatch('login/A_UPDATE_HEADSHOW',true);

            console.log(this.$store.getters['login/getHeaderShow']);

            this.$store.commit('login/M_UPDATE_FOOTSHOW',true);

            this.$router.push({path:'/'})

 

公共头部页面中使用

<footer class="foot" v-show="$store.getters['login/getFootShow']">