我想在我的Dashboard.vue. x-axis和上的数据Y-axis来自我的 vuex 商店。当我检查浏览器上的 Vue 插件时，我可以看到来自商店的数据正在被访问。这是我的LineChart.js文件版本（图表的逻辑所在的位置）。
import { Line } from 'vue-chartjs'
export default ({
extends: Line,
data() {
return {
xAxis: [],
yAxis: [],
title: "My activities"
}
},beforeMount(){
console.log('beforeMount')
},
computed: {
averageNumbers: function() {
console.log('computed')
return this.$store.getters.userData
},
daysItems: function(){
return this.$store.getters.userDataXAxis
}
},
watch: { // watch changes here
averageNumbers: function(newValue) {
console.log('watch')
for (var i=0; i < newValue.length; i++){
this.yAxis.push(newValue[i].val)
}
},
daysItems: function(newVal){
for (var i=0; i < newVal.length; i++){
this.xAxis.push(newVal[i])
}
}
},
methods:{
renderLineChart: function() {
this.renderChart({
labels: this.xAxis,
datasets: [
{ label: this.title, backgroundColor: '#dd4b39', data: this.yAxis }
]
},
{ responsive: true, maintainAspectRatio: false })
},
},
mounted() {
console.log('mounted')
this.renderLineChart();
}
})
我的图表显示如下（图片）：
正如你在图片上看到的，我有两个红点；这些是针对前两组数据的：[18 January and 63.5]&[21 january and 23.9]所以我只得到了五分之二（目前数据对的总数）。谢谢您的帮助！