最近遇到一个问题,将Echarts抽离后,点击导航栏,不进行页面跳转对Echarts的数据进行更新(简单来说就是不同的数据,一个页面),数据已经传入到Echarts中,但是只有在Echatrs第一次熏染时才有数据,进行跳转之后数据始终无法出来。在经过无数次尝试之后,数据出来了但是新问题就是点击导航栏第一个没有数据,第二个的数据是第一个,而且数据是在累加,这个问题网上说将 myChart.setOption(option,true)在这里加这个true,发现还是不行。
然后我尝试将在Echarts之前,我遍历数组之前将X、Y分别对应的数组进行清空,但是还是不可以 ,原因就是父组件的数据没有和Echarts中的数据同步。
我的解决办法:
在Echarts中监听存放数据数组
deep:true;是一定需要的;this.drawChart()是Echarts的初始化函数;
到这里所有的数据都可以出来了,但是他是在一个图上一直在加,我不想要这样的效果所以我在Echarts初始化的函数中对X、Y数组赋值为空;
(Echarts数据处理的部分代码)
这样就实现了数据的同步更新!第一次使用Echarts也是第一次使用Vue做项目,很多不足请指教!