H5端引入echart 视图更新的大坑

H5端引入echart 视图更新的大坑

1、主要是写移动端引入echart折线图重置数据的时候遇到的样式错乱的坑,效果图如下

2、项目是每次请求数据重置图表，以下会在代码列出错误的地方

//HTML部分
    <div id="main" style="width:100%!important;"></div>
//JS部分
   //在mounted初始化图表
  myChart = echarts.init(document.getElementById('main'))
  //窗口变化时候更新视图
    window.onresize = function () {
          myChart.resize()
        }
   //赋值图表数据，视图更新的坑就在于这个setOption的第二个参数 true，如果是在PC端，则没什么影响，但是如果在移动端，我是用了rem布局，引入了淘宝的flexible.js 
 myChart.setOption(this.optionGauge,true)

3、如果在移动端在初始化页面的时候，setOption可以传入第二个参数true，但是在重新赋值的时候不能写进这个参数，会导致视图样式错误，本来设置300的高度，重置数据后，比如我的如下：

4、myChart.setOption(this.optionGauge,true)中的true是更新视图层的作用，具体为啥会导致在移动端出现这种情况，小弟也不清楚，哪位大佬懂的话，提点一下 ，谢谢，希望能帮助到大伙！

标签：echart,setOption,myChart,视图,H5,更新,true
来源： https://blog.csdn.net/ZhouLoverBrother/article/details/111155100