在element跑马灯组件内使用echarts地图组件时不显示的问题

185 阅读1分钟
技术栈:vue2 + elementUI + echarts
  • 业务需求:一个大屏页面,需要在中间区域展示一个地图的轮播组件; image.png
  • 问题:轮播图的第一个是地图组件,后面两个图片正常展示,地图显示为空
  • 解决办法:之前是在地图挂载的时候就直接对地图进行初始化,就算是用了vue的$nextTick()方法,也不会生效 image.png 因为地图渲染在html挂载之前,所以要改变地图初始化的顺序,把init_map()方法写到getInitData()方法的最下边,这个方法里面一定会有异步操作,所以等html挂载之后再去渲染地图就不会有问题 image.png