vue.js中使用echarts实现数据动态刷新功能

JavaScript026

vue.js中使用echarts实现数据动态刷新功能,第1张

在vue使用echarts时,可能会遇到这样的问题,就是数据变化时,echarts不更新

这是因为Echarts是数据驱动的,这意味着只要我们重新设置数据,那么图表就会随之重新渲染

如果想要支持数据的自动刷新,必然需要一个监听器能够实时监听到数据的变化然后告知Echarts重新设置数据。

Vue提供了“watch”:

Vue中computed就是 实时计算 使用。 Vue检测到数据发生变动时就会执行对相应数据有引用的函数。 下面是一个demo。引用自己的vue.js就可以看效果。 利用computed可以做一些监控之类的效果。