此情况可能会出现在 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.