摘要：
前天我遇到了一个坑，害了我。我正在帮助我的朋友建立一个微信公众号项目，该项目使用Vue Family Bucket，其中一个模块需要使用数据可视化。我以前在项目中使用过Antv，我很熟悉它。因为它是一个移动项目，所以我使用Antvf2作为可视化框架。在我完成了之前的所有写作后，我终于发现下面有两个相同的图例。找了很久，我没有发现问题。我想不通。监视：｛statisticsList:｛handler（newVa
前天遇到个坑，把我给坑死了 ，在帮朋友做一个微信公众号的项目，使用的vue全家桶，有个模块需要用到数据可视化展现，之前做项目的时候用过antv，比较熟悉，因为是移动端的项目，所以用的是antv f2这个可视化框架，按照之前写的方式都做完之后，最后发现下面出现了两个相同的legend，找了半天也没发现问题出在哪，百思不得其解
watch:{
statisticsList: {
handler(newValue, oldValue) {
// 更新数据
this.lineChart.changeData(newValue);
// 修改图表配置重新渲染
this.lineChart.scale('time', {
tickCount: 5, // 定义坐标轴刻度线的条数，默认为 5
type: 'timeCat',
mask: this.chartsDateType
});
this.lineChart.render();
},
deep: true
}
},
后来，又仔细的查看了下f2的文档，发现问题出在这个地方this.lineChart.render();
重新渲染了一次，就出现了两个lenged
解决方法 ：
使用 repaint重新绘制图表this.lineChart.repaint();