Chartjs + Vue.js - 无法读取未定义的属性"_meta"

Question

我正在使用Vue.js + Chartjs构建一个应用程序。我遇到一个问题，我向服务进行 http 调用以获取数据、解析数据并将其传递到我的 Chartjs 组件中。但是，我不断收到错误Cannot read property '_meta' of undefined

以下是我的组件的相关部分：

<template>
    <Chartjs :data="chartData" />
</template>
export default {
data () {
    return {
        chartData: false
    }
},
created () {
    this.getData()
},
methods: {
    getData() {
    const opts = {
        url: 'some_url',
        method: 'get'
    }
    request.callRoute(opts).then(results => {
        this.chartData = results.data
    }).catch(err => {
        console.log(err)
    })
    }
},
components: {
    Chartjs
}
}

注意 - 如果我使用从我的请求返回的数据对chartData字段进行硬编码，图表呈现良好。但是，如果我先为我的数据发出 http 请求，它不起作用。

有谁知道会发生什么？

提前感谢！

Answer 1

Vue 将使用初始chartData(这是一个布尔值(渲染组件。您应该使用 v-if 或其他逻辑，并在有响应时呈现Chartjs组件。例如，您可以在chartData为假时显示加载消息/动画。