Chartjs-Vuejs data not showing properly on mounted

by

0👍

This should be on mounted(). I don’t have the editor on comments and i will answer here.

let ref = db.collection('sales').where("sales_date", "==", moment().format('DD-MM-YYYY'))
   .get()
   .then(snapshot => {
    var total = 0;
    snapshot.forEach(doc => {
       total += Number(doc.data().price)
    })
    this.sales_today = total;

        var chart = this.$refs.chart;
        var ctx = chart.getContext("2d");
        var myChart = new Chart(ctx, {
            type: 'line',
            data: {
                labels:this.labels,
                datasets: [{
                    label: 'Sales of June',
                    data: [this.sales_today,30,60,10],
                    backgroundColor: [
                        '#ffffff'
                    ],
                    borderColor: [
                        '#1976d2'
                    ],
                    borderWidth: 3
                }]
            },
            options: {
                scales: {
                    yAxes: [{
                        ticks: {
                            beginAtZero: true
                        }
                    }]
                }
            },
        });


 })

P.S. check the console for errors

Leave a comment