未捕获的类型错误：无法设置未定义的属性（设置“渲染”）答案

【问题标题】：Uncaught TypeError: Cannot set properties of undefined (setting 'render')未捕获的类型错误：无法设置未定义的属性（设置“渲染”）
【发布时间】：2021-11-09 06:38:09
【问题描述】：

我正在尝试另一种方法为一些报告制作图表，因为我正在使用 ChartJs、vue、axios 和我数据库中的信息。我已经查看了代码并按照错误指出的点进行操作，但我无法解决它，这里是代码：

<template>
<div>
    <br>
    <br>
    <chart></chart>
        <br>
        <br>
</div>
</template>

<script>
import VueChartJs from 'vue-chartjs'
import Chart from 'chart.js'
import Vue from 'vue'

Vue.component('chart',{
  extends:VueChartJs.Pie,
  data(){
    return{
      etiquetas: [],
      stock: [],
      bgColors: ['#5DB3E2', '#5DE2C1 ', '#C0E25D '],
    }
  },
  mounted(){
    this.mostrar()
    this.renderChart({
      labels: this.etiquetas,
      datasets: [
        {
          label:'Graficos',
          backgroundColor: this.bgColors,
          data: this.stock
        }
      ]
    }, {responsive:true, maintainAspectRadio:false})
  },
  methods:{
    mostrar(){
      axios.get('http://localhost:4000/users')
      .then(response => {
        response.data.forEach(element => {
          this.etiquetas.push(element.position)
          this.stock.push(element.id)
        });
      })
    }
  }
})

</script>

这是整个错误：

Uncaught TypeError: Cannot set properties of undefined (setting 'render')
    at normalizeComponent (componentNormalizer.js?2877:24)
    at eval (Reports.vue?ab61:8)
    at Module../src/views/Reports.vue (app.js:1836)
    at __webpack_require__ (app.js:849)
    at fn (app.js:151)
    at eval (index.js?a18c:1)
    at Module../src/router/index.js (app.js:1716)
    at __webpack_require__ (app.js:849)
    at fn (app.js:151)
    at eval (main.js:13)

非常感谢您帮助解决这个问题。

【问题讨论】：

标签： javascript vue.js chart.js typeerror

【解决方案1】：

您似乎没有正确导出 Vue 组件定义。尝试添加export default {

【讨论】：

【解决方案2】：

您应该使用export default 注册组件，像往常一样使用单文件组件。这看起来像这样：

<script>
export default {
  name: 'chart'
}
</script>

【讨论】：