vue写echarts 报错 Cannot read property ‘init‘ of undefined“

最新推荐文章于 2022-05-18 21:31:29 发布
最新推荐文章于 2022-05-18 21:31:29 发布
阅读量4.6k 收藏 12
点赞数 22
分类专栏： vue
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_35567179/article/details/110734722
版权
  1. 试了在main.js里写
import echarts from 'echarts'
Vue.prototype.$echarts = echarts

然后组件内引用

this.$echarts.init(document.getElementById('idname'));

无用


2. 又试了只在组件内引用

import echarts from 'echarts'

echarts.init(document.getElementById('idname'));

无用


3. 在init之前检查了document.getElementById('idname') 并不是null，是确实存在的对象



4. 最后main.js也不用了，import 也不用了，直接require

let echarts = require('echarts');
let myChart = echarts.init(document.getElementById('myPancake'));

官方文档按需引入 ECharts 图表和组件：
https://echarts.apache.org/zh/tutorial.html#%E5%9C%A8%20webpack%20%E4%B8%AD%E4%BD%BF%E7%94%A8%20ECharts

VUE3 全局使用aixos，解决Cannot read property ‘get‘ of undefined的问题
aj951225的博客
04-08 8173
原因：axios 不能像其他组件一样通过 Vue.use() 直接被引用 一、安装 npm install axios --save 二、在main.js插入import axios from ‘axios’ import { createApp } from 'vue' import App from './App.vue' import axios from 'axios' const app = createApp(App) app.config.globalProperties.$axios =
echarts报错 Cannot read property ‘getAttribute‘ of undefined
飘来荡去这一生
09-07 4888
今天在review代码时，发现控制台莫名报错，Cannot read property 'getAttribute' of undefined 通过查看，问题定位在这一行，也就是echarts初始化的时候: const chart = echarts.init(this.$refs['chart']); 结合报错信息可以得知，错误原因是因为没获取到dom属性。 在vue中获取不到dom一般分为两种情况，一是在created中获取，这个时候只是创建了vue实例，dom并没有开始渲染。所以自然拿不到.
Uncaught TypeError: Cannot read property 'init' of undefined
hdn_kb的博客
02-11 7432
在工作中有一次遇到了前端控制台报错的问题： 这是我在使用zTree属性结构插件的时候遇到的问题，主要原因是：我在引入js的时候，将zTree.js放在了jquery.js的前面所导致的。 解决办法：将jquey.js文件放在最前面即可。 因此，我们在引入js文件的时候，如果需要引用jquery.js，则一定一定要把jquey.js文件放在做前面。 ...
Vue坑点杂谈（七）在Vue中引入Echarts报错 Cannot read property ‘init‘ of undefined
ODST_TheSolverO5的博客
12-13 2067
Vue坑点杂谈（七）在Vue中引入Echarts报错 Cannot read property ‘init’ of undefined 一、写在开头 最近使用Echart时发现与Vue有些不兼容的地方，会出现一些奇怪的报错，在这里记录一下帮助同样遇到问题的朋友们。 二、发现问题 出现问题是在mounted（）中使用官方示例的时候报了以下错误： Error in mounted hook: “TypeError: Cannot read property ‘init’ of undefined”。 三、解决问
Cannot read property ‘init‘ of undefined
qq_44802808的博客
01-14 1万+
在项目中导入echarts插件时，报了这个问题，当时以为是，没有获取到dom元素，所以用$refs的形式获取dom元素 改变获取元素的方式后，还是报同样的错，但已经确定这两种方式都可获取到dom元素 于是，最后在网上搜索之后，发现需要在导入包的时候添加上 * as 即可 看网上说还有一种原因是因为echarts版本太高导致的，应该引入4.9.0或4.8.0版本，但尝试后没有解决我的问题 ...
解决Cannot read property ‘init‘ of undefined
YanXiHelloWorld的博客
06-16 1095
var ztree = new $ZTree("dataTree", "/eamAssetsData/selectMenuTreeList"); ztree.bindOnClick(EamAssetsData.onClickMenu); ztree.init(); new对象的时候m
vue中使用echarts及报错（Cannot read property ‘init‘ of undefined）处理
shinjie1210的博客
08-02 1461
安装步骤 项目控制台输入npm install echarts --save 找到main.js 引入 import * as echarts from 'echarts' Vue.prototype.$echarts = echarts 然后就可以按照官网文档里的5分钟上手内容使用了 这里给个简单例子 官网上扒的示例图表 <template> <div class="home"> <div id="echarts" style="width:6...
引用echarts报错Cannot read property ‘init‘ of underfined
sunshineTing2的博客
01-14 214
检查一下 echarts 的版本 "echarts": "^5.0.0", // 替换为4.8.0 正确下载和使用 1.下载 ^4.8.0 版本的echarts npm install --save echarts@4.8.0 2.在main.js中引入 echarts（全局引入） import echarts from 'echarts' Vue.prototype.$echarts = echarts 3.在.vue页面中使用echarts <div ref="myChart" id="m.
vue Echarts自适应浏览器resize报错：Cannot read property 'resize' of undefined
且听风吟的博客
07-19 1万+
Echarts自适应浏览器resize报错：Cannot read property 'resize' of undefined1.问题2.解决办法3.成果 1.问题 今天在做Echarts自适应浏览器时，发现一个问题：Cannot read property ‘resize’ of undefined。 Echarts插件绘制的柱状图正常情况下页面截图： 但是当我拖动浏览器窗口的边框进行缩放时...
Vue中使用echarts报错，【TypeError: Cannot read property ‘init‘ of undefined】
MyBlog
08-26 386
将以下这行代码替换 import echarts from 'echarts' 替换代码 import * as echarts from 'echarts' 使用方式 <script> import * as echarts from 'echarts' export default { data () { return {} }, mounted () { const myChart = echarts.init(document.getElementById
cannot read property ‘_init‘of undefined
qq_41659686的博客
01-08 420
mpvue解决报错cannot read property ‘_init‘of undefined 删除dist目录，然后重启项目
vue 报 Cannot read property ‘init‘ of undefined
JBOX_AJAX的博客
08-18 2893
做为一名后端开发，因为工作需要，了解了一些前端vue知识，最近也是在vue框架碰见一个问题，在一个echarts页面中图表不显示，并且出现了这样的错误“Cannot read property 'init' of undefined”，经过分析觉得是没有import进去，或者是根本没有运用到echarts这个组件，以下是我碰见的问题并解决过程： 1.问题： 2：在main.js中找到导入的echarts 并在 import 后加入 * as （虽然我也不知道为什么，不太了解，但是成功重新了echa.
在vue中使用echarts出现Cannot read property ‘init‘ of undefined
weixin_54276998的博客
01-06 852
在vue中使用echarts出现Init is not defined 前面的博客有写具体的引入echarts的方法,这里主要讲“init”报错的问题 可能是安装的echarts版本太新导致的 1.先卸载echarts npm uninstall echarts --save 2.安装旧版本的 npm install echarts@4.2.0-rc.2 --save 基本就没什么问题了 ...
TypeError: Cannot read property ‘init‘ of undefined
qq_30815659的博客
04-07 1857
使用element 的echarts 进行图表渲染时 如果报TypeError: Cannot read property ‘init’ of undefined 可以在引入的时候修改 import * as echarts from 'echarts'
在使用zTree 框架时前端报错Uncaught (in promise) TypeError: Cannot read property ‘init‘ of undefined
热门推荐
weixin_55229531的博客
05-18 5万+
在使用zTree 框架时前端报错Uncaught (in promise) TypeError: Cannot read property 'init' of undefined
echarts Cannot read property 'init' of undefined 报错问题
qq_35363709的博客
03-04 9568
一： let myChart= this.$echarts.init(this.$refs.myChart); 可能报Cannot read property 'init' of undefined 的错 二： letmyChart= echarts.init(document.getElementById('myChart')); 可以试试，我试的可以哎 ...
ucharts报错Cannot read property 'restore' of undefined
最新发布
03-18
### 关于 uCharts 报错 `Cannot read property 'restore' of undefined` 的原因及修复方案 #### 原因分析 该错误通常发生在尝试调用未初始化的对象方法时。具体到 uCharts 中，可能的原因有以下几种： 1. **图表...
评论 16
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值