引用echarts图表,使用vue指令v-show,图表宽度默为100px的问题解决方法

使用vue的v-show指令时,echarts图表宽度为100px。基于准备好的dom,获取其父(祖先)节点元素的宽度,使dom元素的宽度等于其父(祖先)节点元素的宽度。代码如下:

<div
  id="chartLine"
  class="chartLine"
/>
// 基于准备好的dom,初始化echarts实例
const $dom = document.getElementById('chartLine')
$dom.style.width = $dom.parentNode.parentNode.clientWidth + 'px'
myChart = this.$echarts.init($dom)

 

posted @ 2020-09-23 14:51  jianghongyun  阅读(1736)  评论(0)    收藏  举报