Javascript Vue.js:重新定义图表的数据
我使用vue-chart.js绘制一个简单的图表Javascript Vue.js:重新定义图表的数据,javascript,vue.js,vue-chartjs,Javascript,Vue.js,Vue Chartjs,我使用vue-chart.js绘制一个简单的图表 import { Line } from 'vue-chartjs'; export default { extends: Line, mounted() { this.renderChart({ labels: [this.getChartLabels], datasets: [ { label: 'Active users', backgroundColor: '#f87979',
import { Line } from 'vue-chartjs';
export default {
extends: Line,
mounted() {
this.renderChart({
labels: [this.getChartLabels],
datasets: [
{
label: 'Active users',
backgroundColor: '#f87979',
data: [this.getChartData],
},
],
},
{ responsive: true,
maintainAspectRatio: false,
});
},
computed: {
...mapGetters(['getFullReport', 'getChartLabels', 'getChartData']),
},
methods: {
...mapActions(['loadFullReport']),
},
};
当我在
mounted
中控制台getter时,我可以看到我接收到一个包含两个项目的数组,但是当我重新加载页面时,数组似乎是空的。图表本身在页面重新加载之前和之后都不会显示任何信息。请帮忙 您应该添加一个监视程序,用于监视getter中的更改。
然后通过this.$data.\u chart.update()
Chart.js不是被动的。如果在图表实例渲染后数据发生更改或“延迟”,您将什么也看不到
我猜你的商店里满是API?那么它就更重要了,因为您的API调用是异步的