问题描述
vue3
dhtmlx-gantt 8.0.1
绘制甘特图,为方便调用,将其封装为一个甘特图页面GanttCalendar.vue,页面中单独获取数据,绘制甘特图。发现问题,在A页面使用甘特图后,在B页面再次使用,B页面显示的是老的数据,刷新B页面才可以更新为新的。
分析
可能是因为次插件在重复调用时,直接将初始化好的甘特图复用,不主动刷新数据。
解决办法
在甘特图页面(GanttCalendar.vue)使用onBeforeMount生命周期钩子函数,保证每次引入时清理数据重新生成。
onBeforeMount(() => {
gantt.clearAll()
})