Use the Vue component to pass a value as a global variable, but you can't get it?

The

component global, is used to store user login information.
global.vue

<script type="text/ecmascript-6">
    const CLIENT_ID = "";
    const USER_INFO = {};
    const SESSION_GLOBAL = {};
    
    export default {
        CLIENT_ID,
        USER_INFO,
        SESSION_GLOBAL
    }
</script>

header.vue

import global from "../../components/global/global.vue";

created(){
let cookie_arr = document.cookie.split(";");
    for(let i = 0; i < cookie_arr.length; iPP){
        let cookieArrTrim  = cookie_arr[i].trim();
        if(cookieArrTrim.indexOf("client_id") == 0){
            global.CLIENT_ID = cookieArrTrim.substring("client_id".length + 1, cookieArrTrim.length);
            if(global.CLIENT_ID !== ""){
                this.$http.get("http://192.168.1.5/app/getClient.action", {
                    params: {
                        "clientId": global.CLIENT_ID
                    }
                }).then(response => {
                    response = response.body;
                    global.USER_INFO = response.object;

                    this.user_info.avatar = global.USER_INFO.imgUrl;
                    this.user_info.user_name = global.USER_INFO.nickName;
                    this.user_info.phone = global.USER_INFO.phone;

                    console.log(global);



                })
            }
        }

        else{
            return;
        }
    }
}
                                
console.log(global);

sell_car.vue


global
safarichromefirefox

Mar.04,2021

it has no value when you see that console.log () is not clicked on. It is estimated that it is still a problem of timing, that is, it has not been assigned when it is used. Because of the mechanism of console.logd, you need to use console.log (JSON.stringify (xxx)) ) to transfer string output where something goes wrong.
in addition, looking at your global.vue only exposes an object with three attributes, it is not necessary to name it .vue file, you can directly use the .js file, the effect is the same.


I think there is something wrong with your design idea. The component is instantiated once in every place, so how is it possible to pass a value?

Menu