关于在Vue项目初始化echarts时报错TypeError:Cannot read property ‘init‘ of undefined的解决办法

报错
在Vue项目中遇到的一个问题,初始化echarts时报错TypeError:Cannot read property ‘init‘ of undefined
在这里插入图片描述
解决办法
导入echarts
在Vue项目中的main.js文件中导入如下代码:
1.将 import echarts from ‘echarts’ 替换成 import * as echarts from ‘echarts’
2.将 echarts 挂到Vue原型上

import * as echarts from 'echarts'
Vue.prototype.$echarts = echarts

初始化echarts
在Vue项目中使用echarts,需要挂载到mounted生命周期函数内:

mounted() {
// mounted为挂载阶段,此时页面上的元素已经被渲染完毕了
// 基于准备好的dom,初始化echarts实例
var myChart = this.$echarts.init(document.getElementById('main'))
}

猜你喜欢

转载自blog.csdn.net/baidu_40662718/article/details/115057661