Echart 5.0+版本报错Error in data(): “TypeError: Cannot read properties of undefined (reading ‘graphic‘)“

首先第一步需要检查echarts的导入方式，在5.0以后的版本，echarts做了比较大的调整，在vue中引入时必须使用如下命令// import echarts from 'echarts' 这种方式高版本不支持import * as echarts from 'echarts'vue.prototype.$echarts = echarts其次在结合vue-echarts使用时才可以使用如下命

IT淘金者

5579人浏览 · 2021-09-30 09:42:58

IT淘金者 · 2021-09-30 09:42:58 发布

首先第一步需要检查echarts的导入方式，在5.0以后的版本，echarts做了比较大的调整，在vue中引入时必须使用如下命令

 // import echarts from 'echarts' 这种方式高版本不支持
 import * as echarts from 'echarts'
 vue.prototype.$echarts = echarts

其次在结合vue-echarts使用时才可以使用如下命令添加渐变

color: new this.$echarts.graphic.LinearGradient(0, 0, 0, 1, [
 {
    offset: 0,
    color: 'rgba(90, 184, 126, 1)'
  },
  {
    offset: 1,
    color: 'rgba(90, 184, 126, 0.08)'
  }
])

最后，打完收工！

Vue

前往低代码交流专区

更多推荐

vue 表单验证

1、6位小写字母和数字必须包含两个字母rules: [{ required: true, message: "XXX不能为空", trigger: "blur" },{ max: 6, message: "最大长度为6位字符", trigger: "blur" },{pattern: /^(?=(?:[^a-z]*[a-z]){2})[a-z0-9]{6,6}$/, //不连续的两位字母// /^