图表无限刷新，realOption computed() 在未被修改 props.option 情况下无限触发

[gimjin]

请确认

• [x] 我可以确认这个问题无法在 ECharts 项目本身中复现。

您是如何将 Vue-ECharts 引入项目的？

通过 ES 模块 import

版本信息

echarts@5.2.0
vue@2.6.14
vue-echarts@6.0.2

问题详情

操作步骤： 1, template 中写入 \。 2, init-option 绑定了固定的空对象不可能会重新修改 3, option 在 data 中设置，名称为 option 5, 在 data 中设置 title，用于其他组件的赋值 4, 在 mounted 生命周期函数中通过 setInterval 每1秒 更改 this.title （并未修改 this.option，更是不可能修改 init-options 中绑定的空对象）

实际效果： 每1秒 刷新图表

源码查看结果： src/ECharts.ts 87行 props.initOptions 总是被 computed 检测被修改，导致 216 行 watch 被执行 init() 重新创建ecahrt实例。 但实际上initOption绑定了空对象不可能被检测修改，我严重怀疑 vue-demi 引入的 computed 有响应式缺陷。

问题复现

https://codesandbox.io/s/brave-rosalind-wu96mq?file=/index.html

[Justineo]

你写 :init-options="{}" 意味着每次重新渲染的时候，它都会被赋值成一个新的空对象，所以每次渲染时它都改变了。改成固定的就好了：https://codesandbox.io/s/epic-smoke-vsc48h?file=/index.html

[gimjin]

你写 :init-options="{}" 意味着每次重新渲染的时候，它都会被赋值成一个新的空对象，所以每次渲染时它都改变了。改成固定的就好了：https://codesandbox.io/s/epic-smoke-vsc48h?file=/index.html

非常感谢，确实是解决了此问题。

不过按照你的思路即便是没有 setInterval 修改无关的 data 也应该是每次重新渲染时 prop 都会发生变化，会无限重新刷新才对。 但是现在的现象是 setInterval 设置多少延时就会按照此时间来不断刷新。 感觉就像 root ref 来强行重绘图表时 prop 的响应式被切断，不会被watch检测到，然后修改无关的 data 值时又被激活props响应式的感觉。