vue中用v-if切换echarts不显示
当用v-if切换页面的时候 从第二页返回到第一页的时候,第一页的echarts图不显示
是因为切换回来的时候并没有触发生命周期函数, 所以第一页的图并不能显示
话不多说 直接上图
父组件里有echarts
子组件person里也有echarts
// 父组件
在这里插入图片描述
当子组件点击返回的时候 触发@goBack事件
// 子组件
在这里插入图片描述
在这里插入图片描述
// 父组件
在这里插入图片描述
如图,用vue的nextTick()来触发echarts事件. 图中的changeDate1就是获取echarts的方法
nextTick请自行查阅;

有的同学可能想到用v-show 但是用v-show的话,子组件的echarts图就不能显示.
再说一下: v-if和v-show的区别

v-if:当隐藏结构时该结构会直接从整个dom树中移除;(删除重构DOM)
v-show:当隐藏结构时是在该结构的style中加上display:none,结构依然保留。(改变style)

Logo

前往低代码交流专区

更多推荐