ECharts 使用时控制台报错 `resize` should not be called during main process

Posted by Yun on Mon, Jan 31, 2022

此情况可能会出现在 ECharts 与 Vue 3 结合使用的场景下,尤其是将 ECharts 实例使用 ref 包装之后。

本文节选自本人另一篇博文 Vue 3 开发中的 ECharts 5 使用

1. 问题分析

一般情况下,对 ECharts 图表封装并不需要将 echarts 对象暴露到渲染上下文中。如果确实有意将 echarts 对象声明为响应式,请使用 shallowRef 而非 ref

1// GOOD
2const chart = shallowRef<echarts.ECharts>(); 
3
4// BAD
5const chart = ref<echarts.ECharts>();

如果不使用 shallowRef,可能会导致命令行报错 `resize` should not be called during main process;事实上,任何第三方库创造的实例都应当使用 shallowRef 而非 ref 进行响应式处理。

2. 参考链接


版权声明:本文遵循 CC BY-SA 4.0 版权协议,转载请附上原文出处链接和本声明。

Copyright statement: This article follows the CC BY-SA 4.0 copyright agreement. For reprinting, please attach the original source link and this statement.