Phenomenal description

When the page is loaded, the loading of "data loading" is always displayed.

One of the solutions

The reason for this may be that the page is loading two or more api data requests at the same time, that is, calling the background interface multiple times.
Solution: synchronous execution is the execution of one method after another.

Example

(1) The data loading example code appears all the time:

mounted() {
    this.bug1();
    this.bug2();
    this.bug3();
},

//Connect api function
bug1() {
    this.$http.post(this.HOST + '/cust/action1.do', {
        'projid': this.$store.state.core.loginFormInfo.projId,
        'custid': this.clientId
    }, {
        emulateJSON: true
    }).then((response) => {
        if(response.data.success) {}
        if(!response.data.success) {}
    })
},
bug2() {
    this.$http.post(this.HOST + '/cust/action2.do', {
        'projid': this.$store.state.core.loginFormInfo.projId,
        'custid': this.clientId
    }, {
        emulateJSON: true
    }).then((response) => {
        if(response.data.success) {}
        if(!response.data.success) {}
    })
},
bug3() {
    this.$http.post(this.HOST + '/cust/action3.do', {
        'projid': this.$store.state.core.loginFormInfo.projId,
        'custid': this.clientId
    }, {
        emulateJSON: true
    }).then((response) => {
        if(response.data.success) {}
        if(!response.data.success) {}
    })
},

(2) Solution sample code:

mounted() {
    // 1.Execute first
    this.bug1();
},



bug1() {
    this.$http.post(this.HOST + '/cust/action1.do', {
        'projid': this.$store.state.core.loginFormInfo.projId,
        'custid': this.clientId
    }, {
        emulateJSON: true,
        async: false,
    }).then((response) => {
            // 2.Execute the second
            this.bug2()
        }
        if(!response.data.success) {}
    })
},
bug2() {
    this.$http.post(this.HOST + '/cust/action2.do', {
        'projid': this.$store.state.core.loginFormInfo.projId,
        'custid': this.clientId
    }, {
        emulateJSON: true,
        async: false,
    }).then((response) => {
            // 3.Execute the third
            this.bug3()
        }
        if(!response.data.success) {}
    })
},
bug3() {
    this.$http.post(this.HOST + '/cust/action3.do', {
        'projid': this.$store.state.core.loginFormInfo.projId,
        'custid': this.clientId
    }, {
        emulateJSON: true,
        async: false,
    }).then((response) => {
        if(response.data.success) {}
        if(!response.data.success) {}
    })
},

That is, the three request background api functions executed in mounted() are executed one by one.