yiyixun
yiyixun
  • 发布:2019-04-30 17:58
  • 更新:2020-06-29 10:44
  • 阅读:9312

用npm的方式引入echarts,出现这个错: el.addEventListener is not a funct

分类:uni-app

原本是按照https://ask.dcloud.net.cn/article/19727这个方法引入 mpvue-echarts,能成功运行。
但是用npm方式引入echarts:

import echarts from 'echarts'    
import mpvueEcharts from 'mpvue-echarts'       

替换原来的:
```
import * as echarts from '@/components/echarts/echarts.simple.min.js';
import mpvueEcharts from '@/components/mpvue-echarts/src/echarts.vue';

就会报错:  
*index.umd.min.js:1 [system] errorHandler TypeError: el.addEventListener is not a function  
    at addEventListener (event.js:138)  
    at HandlerDomProxy.<anonymous> (HandlerProxy.js:288)  
    at Array.forEach (<anonymous>)  
    at Object.each (util.js:298)  
    at mountHandlers (HandlerProxy.js:287)  
    at new HandlerDomProxy (HandlerProxy.js:274)  
    at new ZRender (zrender.js:138)  
    at Object.init (zrender.js:49)  
    at new ECharts (echarts.js:194)  
    at Object.init (echarts.js:1813) Vue {_uid: 1, _isVue: true, $options: {…}, _renderProxy: Proxy, _self: Vue, …} event handler for "view.onRequestComponentInfo"*  
  
请问什么原因呢
2019-04-30 17:58 负责人:无 分享
已邀请:
不是发哥

不是发哥

在echarts的代码里面,有一段代码是:

function(t)

把它改为:

function(t,window,document)
  • 1***@qq.com

    大佬安卓端报 this.echarts.setCanvasCreator is not a function 错误知道怎么解决么


    2019-05-01 17:33

  • 不是发哥

    回复 1***@qq.com: 请尝试延时执行


    2019-05-01 19:30

  • yiyixun (作者)

    感谢回答 不过npm的echarts里 哪个文件有function(t)?


    2019-05-06 17:59

  • 不是发哥

    回复 yiyixun: echarts.min.js或者echarts.js


    2019-05-08 10:21

  • z***@qq.com

    回复 不是发哥: 有1400多个function(t)


    2020-05-27 18:26

  • 6***@qq.com

    回复 z***@qq.com: 打开文本搜索 搜function 从上往下找 把第三个位置的function 修改即可


    2021-05-27 16:39

4***@qq.com

4***@qq.com

安卓IOS微信应该都是没问题的,如果是H5的话,不建议用封装的mpvue-echarts标签,而是使用原本的H5用法,采用预编译,类似
<template
<view class="wrap">
<!-- #ifndef H5 -->
<mpvue-echarts :echarts="echarts" :canvasId="myChartId" :onInit="onInit" />
<!-- #endif -->
<!-- #ifdef H5 -->
<view :id="myChartId" style="width: 100%;height: 100%"></view>
<!-- #endif -->
</view>
</template>
<script>
import * as echarts from 'echarts'
// #ifndef H5
import mpvueEcharts from 'mpvue-echarts'
// #endif
...
// #ifdef H5
mounted(){
this.myChart() //函数调用
},
// #endif
method:...
// 初始化
// #ifdef H5
myChart(){
// let el = uni.createSelectorQuery().select('myChart');
let el = document.getElementById(this.myChartId);
let myChart= echarts.init(el);
const option = this.getOption();
myChart.setOption(option);
},
// #endif
// #ifndef H5
onInit(canvas, width, height) {
console.log('onInit(canvas, width, height)');
let myChart = echarts.init(canvas, null, {
width: width,
height: height
});
canvas.setChart(myChart);
const option = this.getOption();
myChart.setOption(option);
return myChart;
},
</script>

zhangyingkai

zhangyingkai

感谢 终于好了 谢谢大佬

该问题目前已经被锁定, 无法添加新回复