[Vue警告]:挂钩错误:" TypeError:this。$ refs.canvas未定义"

时间:2018-06-14 07:18:01

标签: vue.js chart.js

我在我的一个项目中使用了Vue Chart但是收到了这个错误。

这是图表组件

<line-example></line-example>

这是我的剧本

<script>
import Navbar from '@/components/navbar/Navbar'
import {Line} from 'vue-chartjs'


export default {
    extends: Line,
    components:{
      Navbar,
      'line-example': Line
    },
    data(){
      return{
          dialog:null
      }
    },
    mounted () {
        this.renderChart({
          labels: ['January', 'February', 'March', 'April', 'May', 'June', 'July'],
          datasets: [
            {
              label: 'Data One',
              backgroundColor: '#FC2525',
              data: [40, 39, 10, 40, 39, 80, 40]
            },{
              label: 'Data Two',
              backgroundColor: '#05CBE1',
              data: [60, 55, 32, 10, 2, 12, 53]
            }
          ]
        }, {responsive: true, maintainAspectRatio: false})

    }
  }
</script>

您可以在此处找到完整的代码 https://github.com/Shakilzaman87/pukucrm/blob/master/src/components/dashboard/Dashboard.vue

有谁能让我知道为什么会发生这种错误?

1 个答案:

答案 0 :(得分:0)

如果您使用的是单个文件模板,则必须删除  标签,因为您正在扩展vue元素