Chartjs-Pass data from array to function vue

by

0👍

Instead of creating another function for asynchronous call you could add get call inside mounted and in its return in .then() function create your chart and perform other operations.

Other way could be you return promise object from the method and then on its .done() method you could write your mounted code logic.

0👍

Your code is fine. What is happening here your code is finished executing before you get the data from the server. When you are calling the methods mine(), it is sending HTTP request asynchronously. But your Vue code does’t wait for the response it will get. Instead it continues running the rest of the script. By the time you get the response from the server, Vue already initialized your chart with the blank data.

So you have to make sure you initialize your chart after you successfully get the data from the server. Put the initialization code within a method and call that method after you get the data from the server —

            this.$http.get('tests/mine').then(response=>{
                self.tests = response.data.tests;
                // initialize your chart here, like -
                // this.initChart();
            }.bind(this)).then(error=>{
                console.log(error) ;
            });

Leave a comment