vue3+echart5遇到的坑Cannot read properties of undefined (reading 'type')怎么解决
WBOY
发布:2023-05-11 19:07:04
转载
461人浏览过
1、错误说明
vue3中,使用data的方式初始化echart图表
1 2 3 4 5 6 7 8 9 10 11 12 13 |
|
在窗口大小发生变化时,需要执行this.chart.resize()
动态调整图表的大小,发生错误:
2、错误原因
vue3中使用proxy的方式监听响应式,this.chart会被在vue内部转换成响应式对象,从而在resize 的时候获取不到
3、解决方案
import { markRaw } from 'vue'
// 初始化
this.chartInstance = markRaw(this.$echarts.init(this.$refs.rank_ref))//获取dom元素
你可以有选择地退出默认的深度响应式/只读转换模式,并将原始的,未被代理的对象嵌入状态图中。它们可以根据情况灵活运用:
-
有些值不应该是响应式的,例如复杂的第三方类实例或 Vue 组件对象。
-
当渲染具有不可变数据源的大列表时,跳过 proxy 转换可以提高性能。
所以在实例化echart时,将其指定为非响应式的即可。
- properties undefined reading echart Cannotproperties undefined reading cannot properties undefined echart5 reading properties undefined reading echart properties typeerror undefined reading properties typeerror reading cannot taro properties undefined reading typeerror undefined property cannot pickalgorithm properties reading cannot quot undefined property cannot clearvalidate undefined property cannot