echarts init 报错

最新推荐文章于 2023-10-20 16:07:42 发布
最新推荐文章于 2023-10-20 16:07:42 发布
阅读量479 收藏
点赞数
文章标签： echarts vue.js javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/duckiamduck/article/details/131012961
版权

js:619  [Vue warn]: Error in mounted hook: "TypeError: Cannot read properties of undefined (reading 'init')"

将

import echarts from 'echarts'

换成

import * as echarts from 'echarts';就行了

因为:import echarts from 'echarts' 会将 echarts 解析为一个 default export
但是 echarts 没有 default export,它只有 named exports
所以 import echarts 会导致 echarts 被解析为 undefined,导致后续调用 echarts.init() 报错。而 import * as echarts 会将 echarts 解析为一个命名空间,echarts 上的属性需要通过 echarts.属性名 访问。这符合 echarts 的模块导出方式,所以不会报错。

duckiamduck
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
echarts.js
08-08
var myChart = echarts.init(document.getElementById('treeChart')); myChart.showLoading(); var data =[[${treeChart}]]; data= JSON.parse(data); console.log(data) myChart.hideLoading(); echarts.util.each(data.children, function (datum, index) { index % 2 === 0 && (datum.collapsed = true); }); myChart.setOption(option = { tooltip: { trigger: 'item', triggerOn: 'mousemove' }, series: [ { type: 'tree', data: data, top: '1%', left: '7%', bottom: '1%', right: '20%', symbolSize: 12, label: { position: 'left', verticalAlign: 'middle', align: 'right', fontSize: 16 }, leaves: { label: { position: 'right', verticalAlign: 'middle', align: 'left' } }, expandAndCollapse: true, animationDuration: 550, animationDurationUpdate: 750 } ] });
initchart:Emacs init 进程的可视化和交互式分析
07-06
启动 Emacs init 进程的可视化和交互式分析。 有关示例，请参阅。 用法 initchart.el提供宏和函数来测量和可视化 Emacs 的初始化过程。 首先，需要记录一些主要函数的执行时间，例如load和require 。 使用宏initchart-record-execution-time-of在你的开始init.el登记关心的功能，然后启动一个Emacs过程如常。 注册函数的执行时间将记录在*initchart*缓冲区中。 然后，您可以通过调用命令initchart-visualize-init-sequence来可视化这些日志，该命令会询问您保存输出 SVG 图像的文件路径。 配置 ; ; Load the library (require 'initchart) ; ; Measure the execution time of a specified funct
echarts出现init错误解决办法
最新发布
辽辽无期的博客
10-20 339
问题描述：vue项目中安装了echarts插件，后台报。重新安装echart（v4.2.0）
微信小程序中使用ECharts 异步加载数据的方法
08-27
主要介绍了微信小程序中使用ECharts 异步加载数据的方法，非常不错，具有一定的参考借鉴价值,需要的朋友可以参考下
大纲
m0_45272038的博客
12-25 983
错误 1、错误一 “export ‘default‘ (imported as ‘echarts‘) was not found in ‘echarts‘ 一直报错 （在“echarts”中找不到导出“echarts”） 重新更新echarts等各种方法都试了，还是解决不了问题 谷歌说可能是版本问题，就查看安装的是echarts 5.0 页面查看报"TypeError: echarts.init is not a function"错误， 但是console.log()出来的echarts.init就是
Echats出现init报错的解决方法
weixin_45331887的博客
04-16 3144
Echats网址 Echats使用文档:https://echarts.apache.org/examples/zh/index.html#chart-type-line 前言 今天做项目的时候，在使用echats出现了下面问题，于是搜了许多解决方法，耗费一点时间后终于解决了问题，图形也可以正常显示了，以下是解决方案(不一定对所有人都有作用)。 二、解决方案 1.引入库（在main.js文件下引入依赖) 代码如下（示例）： import * as echarts from "echarts";//建议按需
Vue||引入echarts，初始化 init 报错Cannot read property ‘init‘ of undefined 或者 echarts.init is not a function
FQ_QIU的博客
06-01 3864
Vue引入echarts.js，初始化init()遇到的坑。
echarts之init报错
追梦少年的博客
01-20 7913
echarts安装后报init错误解决方法@TOC init报错 查看package.json文件中echarts版本，如果是5.0以上的版本请卸载安装指定版本4.2.1，然后就不会报错了
vue 引入 echarts，init初始化报错
weixin_43484014的博客
05-06 8492
vue 引入 echarts，init初始化报错 1.下载echarts npm install echarts --save 2.页面中引入，我只有一个页面需要引用到echarts，所以就直接在页面中引入 import echarts from 'echarts' 3.在methods中写对应的例子 myEcharts() { this.chart = echarts.init(document.getElementById('main')) this.chart.setOp
在vue项目中简单使用Echarts&第一次使用时的各种报错与解决
like896369216的博客
05-21 3501
关于echarts安装版本报错的解决办法，关于Uncaught (in promise) TypeError: Cannot read properties of null (reading 'getAttribute')错误的解决办法
vue init webpack 建vue项目报错的解决方法
10-17
今天小编就为大家分享一篇vue init webpack 建vue项目报错的解决方法，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
PB9 简单使用Echarts
03-12
PB9 简单使用 Echarts，Echarts版本为4，提供折线图，柱状图，饼图，散点图调用示例
echarts.min.js
07-26
基于layUI模块规范改造的 echarts组件，测试完美，可用直接应用到自己的项目中 使用方法 layui.config({ base: '../../../layuiadmin/lib/' //静态... var myCharts = echarts.init($(dom)); // 要绘制图表的盒子dom;
Java ECharts jar包
06-06
ECharts java jar包 直接面向对象生成echart图形对象，java返回的option对象在前台解析为json对象后，直接init就可以生成echart报表。方便快捷。
vue使用echarts报init为undefined问题
青春不打烊的博客
06-25 4175
看了一下代码没有问题；于是查询了下资料得到解决，下边记录下解决过程： 搜了一下主要有几种说法，可以按照一下步骤排查： 1、检查一下echarts是否安装成功 2、如果安装成功了，可能是安装的版本过高。 删除原有的，重新安装指定版本。 npm uninstall echarts --save npm install echarts@4.8.0 --save 3、如果还不好用，查看一下自身的引用时是否引用得不对。 在main.js中改为 import *...
ECharts 报错：Initialize failed: invalid dom 的解决思路
litterCarp的博客
06-27 1919
Initialize failed: invalid dom --eCharts
vue使用echarts报错init is undefined...或者this.dom.getContext is not a function
dg_xdg的博客
09-16 2816
vue使用echarts报错init is undefined...或者this.dom.getContext is not a function
echarts报错Uncaught (in promise) Error: Initialize failed: invalid dom.
热门推荐
zkx529的博客
05-11 3万+
问题描述 在使用echarts时报错Uncaught (in promise) Error: Initialize failed: invalid dom. 原因 这是由于echarts在初始化化时是需要获取dom的。 let myChart = this.$echarts.init(document.getElementById('main')); 例如在上面这个 myChart初始化时需要获取到 id="main" 的这个dom元素，所以在图表初始化的时候获取不到dom的时候就会出现这样的
Echarts出现 “init of undefined“ 的解决方案
二三的博客
03-17 2595
最近在做Echarts图表，遇到了一个有点奇怪的问题：总是报 “init of undefined” ，如下图所示： 在网上百度了解决方案，然后又看了一下官方文档，才发现 Echarts5.0的引入方式和Echarts4的引入方式不一样了。解决方式如下： 第一种解决方案：将Echarts的版本降到V4版本 // 首先先写在echarts的最新版本 npm uninstall echarts --save // 可以安装4.8.0版本（@后面是指定想安装的版本号） npm install echar
echarts.init报错 Cannot read properties of undefined
10-13
2. 在 JavaScript 文件中使用 `echarts.init` 初始化 ECharts 实例时，传入的 DOM 元素存在且正确，例如： ```javascript var myChart = echarts.init(document.getElementById('myChart')); ``` 如果以上两点...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值