小编N. *_*Kue的帖子

Vue.js this.$el.getContext('2d') 不是函数

我正在使用 Vue.js 版本 2 和 Charts.js 创建一个组件,我可以将数据传递给它,它会以一种很好的方式显示这些。这是我的代码:

<template>
  <div class="container">
    <canvas width="900" height="400"></canvas>
  </div>
</template>

<script>
    export default {
        props: ['customers','dates'],
        mounted() {
            console.log('Chart-Component mounted.');
            var context = this.$el.getContext('2d');
            console.log(context);
            var myChart = new Chart(context, {
                type: 'line',
                data: {
                    labels: this.dates,
                    datasets: [{
                        label: '# of Votes',
                        data: this.customers,
                        backgroundColor: [
                            'rgba(255, 99, 132, 0.2)'
                        ],
                        borderColor: [
                            'rgba(255,99,132,1)'
                        ],
                        borderWidth: 3,
                        cubicInterpolationMode: 'monotone',
                        lineTension: 0
                    }]
                },
                options: {
                    scales: {
                        yAxes: [{
                            ticks: {
                                beginAtZero:true
                            }
                        }] …
Run Code Online (Sandbox Code Playgroud)

chart.js vuejs2

3
推荐指数
1
解决办法
3869
查看次数

标签 统计

chart.js ×1

vuejs2 ×1