vue Echarts自适应浏览器resize报错：Cannot read property 'resize' of undefined

最新推荐文章于 2025-03-04 16:28:50 发布

＊且听风吟

最新推荐文章于 2025-03-04 16:28:50 发布

阅读量1w

点赞数 9

分类专栏： # Vue 2.x

本文链接：https://blog.csdn.net/HH18700418030/article/details/96281813

版权

Echarts自适应浏览器resize报错：Cannot read property 'resize' of undefined

1.问题
2.解决办法
3.成果

1.问题

今天在做Echarts自适应浏览器时，发现拖动窗口进行缩放时，会出现一个问题：Cannot read property ‘resize’ of undefined。

Echarts插件绘制的柱状图正常情况下页面截图：
在这里插入图片描述
但是当我拖动浏览器窗口的边框进行缩放时会报错：

相关代码如下：

    mounted() {
   
      //在mounted生命周期函数中实例化echarts对象
      this.drawHistogarm();
    },
    methods:{
   
      drawHistogarm(){
   
        //初始化echarts实例
        let histogram = this.$echarts.init(document

最低0.47元/天解锁文章

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

＊且听风吟

关注关注

9
点赞
踩
12

收藏

觉得还不错? 一键收藏
9
评论
分享

复制链接

分享到 QQ

分享到新浪微博

扫一扫
举报

举报

专栏目录

echarts dataZoom 组件报Cannot read properties of undefined (reading ‘type‘)

Sherry Tian的博客

02-06

1631

使用dataZoom组件，拖拽时报Cannot read properties of undefined (reading 'type')错误，且拖拽不生效问题解决方案。

解决elemet ui表格自适应高度但是切换路由报Cannot read property XX of undefined at windowonresize错误问题

SAKURE2210866448的博客

03-14

808

之前在用element ui时，需要将表格做成自适应高度的，参考了各种方案发现如下方法有效：在对应组件中 mounted() { this.$nextTick(function() { this.tableHeight = window.innerHeight - this.$refs.table.$el.offsetTop - 50 // // 监听窗口...

9 条评论您还未登录，请先登录后发表或查看评论

Echarts自适应浏览器时Cannot read property ‘resize’ of undefined

zxs123csdn的博客

01-19

1441

Echarts自适应浏览器时，发现拖动窗口进行缩放时，会出现一个问题：Cannot read property ‘resize’ of undefined。 window.EventListener('resize',function(){ myChart.resize() // 报错 if(myChart){ myChart.resize() // 不报错 } }) 就正常了 ...

Echarts在resize时报错

最新发布

weixin_55666792的博客

03-04

365

Echarts在resize时报错

关于Vue中使用eCharts响应容器大小的变化，出现Cannot read properties of undefined (reading ‘resize‘)的问题

qq_43210082的博客

04-08

4297

问题重现在Vue2中学习使用eCharts时遇到了如下问题：使用eCharts提供的resize()方法，监听图表容器的大小并改变图表大小。我在组件中这样写： export default { name: "chart", data() { return { chart: null, }; }, methods: { initChart() { this.chart = echarts.init(document.getElementBy

vue使用echarts中resize()自适应屏幕宽度报错：Cannot read property ‘resize‘ of undefined

agua001的博客

07-29

4031

1、在echarts 使用resize()Api 屏幕变化的时候报：Uncaught TypeError: Cannot read property ‘resize’ of undefined 2、看了大佬的文章：https://blog.csdn.net/HH18700418030/article/details/96281813虽然没使用到他说的方法，但是使用了评论者的方法，可行 3、原先的的代码: mounted() { this.$nextTick(() => { this.my

vue使用echarts自适应报错 Uncaught TypeError: Cannot read property ‘resize‘ of undefined

CMDN123456的博客

09-26

356

vue使用echarts自适应报错 Uncaught TypeError: Cannot read property 'resize' of undefined

【vue3中使用echarts resize报错】ECharts.resize() ERROR! Cannot read propert

无言非影的博客

10-27

1603

vue3项目，使用 echarts当窗口发生变动的时候，会触发echarts实例的resize方法，这个时候浏览器会报错。

echarts图表自适应，Cannot read properties of null(reading ‘resize‘)

ZMJ_QQ的博客

11-25

2350

在父组件中引入了多个子组件，每一个子组件中是一个echarts图表，在子组件的方法中 setChartOption(){ let _this=this; this.chart.setOption({ //option....}); window.addEventListener("resize", function () { if (_this.chart) { _this.chart.resize(); } }); } 在进行缩放的时候可能...

Vue报错：Cannot read properties of undefined (reading ‘echarts‘)

SunPeng的博客

07-11

6545

Vue报错：Cannot read properties of undefined (reading ‘echarts‘)，引入中国地图china.js

TypeError:Cannot read properties of undefined (reading‘...‘)

热门推荐

qq_57057576的博客

08-13

10万+

若a为undefined，则会报错，若，a为空，则，a.name为undefined。原因可能是，挂载时，有dom节点，但是数据还未返回。例： a.name a的name属性。不能够读取undefined的属性。

在Vue3中导入Echart飞机航线图的china.js文件，控制台报错TypeError: Cannot read properties of undefined

qq_56937317的博客

09-06

772

解决在Vue3中导入Echart飞机航线图的china.js文件，控制台报错TypeError: Cannot read properties of undefined (reading 'echarts')at china.js:13:22 at china.js:15:3的问题

vue3 echarts resize自适应报错解决

weixin_44133581的博客

06-26

898

不要用data去存储 echarts 实例，可能会报错 undefined ...type...* 使用同一个resize监听事件。

charts.setSize()报Uncaught TypeError:Cannot read properties of undefined (reading ‘setSize‘)

尘风yf的博客

11-23

558

使用定时器解决 charts.setSize()报Uncaught TypeError: Cannot read properties of undefined (reading 'setSize')

echartjs 出现报错 cannot read property ‘resize‘ of null

L_C_sunny的博客

11-27

1969

一直报 cannot read property ‘resize’ of null 终于解决了！！！ mounted() { window.addEventListener("resize", ()=>{ this.chart.resize() // 报错 if(chart){ this.chart.resize(); // 不报错 } }); }, destroyed(){ wi

解决Echarts图标resize函数报错

qq_37622750的博客

06-09

3025

解决Echarts图标resize函数报错问题需求：当页面大小变化时，图表进行重新绘制，响应页面尺寸。修改之前： // 使用刚指定的配置项和数据显示图表。 this.pieChart.setOption(option); window.onresize = () => { // 监听页面变化事件 this.pieChart.resize(); // 调用echart的重绘方法 }; 效果：可以实现效果，但是控制台会报错，_this.pieC

echarts.min.js:25 Uncaught TypeError: Cannot read property 'features' of undefined 报错解决方法

高阳

05-25

1万+

echarts.min.js:25 Uncaught TypeError: Cannot read property ‘features’ of undefined 这是由于加载的echarts.mim.js 库中并没有包含地图库进去，可能在我们看，地图不属于基本图表。解决方法就是下载相应的地图库。如世界地图，中国地图。解决方法地图地址下载包引入到html中即可。

Cannot read properties of undefined (reading ‘resetFields‘)问题及引申

????鱼干～

07-18

2万+

报错Cannot read properties of undefined (reading 'resetFields')

vue3使用echarts切换路由页面空白及resize报错

Liyan_Yanna的博客

07-29

1957

vue3中使用echarts遇到的两个问题。1、切换路由后再切回来，图标显示空白。2、resize报错。

vue使用echarts绘制树图报错typeerror: cannot read properties of undefined (re

09-21

这个错误通常是由于Vue组件中使用`echarts`时，传递给`option`属性的值为`undefined`引起的。具体的原因可能有以下几种情况： 1. 没有引入echarts库：首先要确保已经正确引入了echarts库，可以通过`import echarts from 'echarts'`导入echarts库，然后在Vue组件中使用`echarts`对象。 2. 检查数据源：树图需要根据数据源来生成对应的option配置项，因此可能需要检查数据源是否正确传递给了组件。请确保数据源是一个非空的数组，并且符合echarts树图的数据格式要求。 3. 检查`option`的赋值方式：在Vue组件中使用`echarts`时，需要将生成的`option`配置项赋值给`this.option`，并在模板中使用`v-bind:option="option"`传递给echarts组件。请确认`option`变量已经在Vue组件的`data`选项中定义，并且`this.option`的值不为`undefined`。如果以上步骤都正确执行，并且仍然出现"TypeError: Cannot read properties of undefined"报错，那么可以尝试在调试工具中查看具体报错所在的代码位置，以便更直接地定位到问题所在。