使用grid 后，echarts 宽度计算问题

[NearTheSeas]

使用了antdesign的grid，首次进入界面的时候，echart图表的宽度总是超出界面，切换下路由，或者拖动窗口大小重新计算就回复正常，请问有什么好的方式解决？
个人感觉像是页面布局还没有渲染完成，echarts就已经计算完宽度了

[NearTheSeas]

看到有说这个方法 this.echartsReact.getEchartsInstance().resize();
但是我调用后报错，

[hustcc]

我们年前在线上也遇到这个问题，下周着力寻找原因和解决方案，再详细回复你…

[Viin-zx]

感觉跟我遇到的那个高度计算的问题有点像。也是重新计算大小才会正常。

[hustcc]

@Viin-zx 应该是同一个问题，都是容器渲染顺序的问题，然后容器大小修改之后，没有自动调用 resize。

理论上使用：this.echartsReact.getEchartsInstance().resize(); 是可以解决的！

[NearTheSeas]

我之前考虑一种解决方式就是给ReactEcharts 加个固定宽度，然后定位居中，但是不治本，也不好看；
resize 报错这个我再研究下

[hustcc]

resize 报错的错误发出来看看！

[Viin-zx]

@hustcc 我试着在componentDidMount中resize了也没有用。。。

[hustcc]

setTimeout 延迟 resize 试试，渲染顺序问题。

[Viin-zx]

@hustcc 可以了，谢谢。

[hustcc]

@NearTheSeas 我在本地，使用 antd 的 grid 也无法复现这个问题。包括我们线上也无法复现，所以很难去修复。

你能在 codepen 上写一个示例复现这个问题吗？

[NearTheSeas]

最近在赶项目，得等上完线之后了；我找到另一种解决方式就是，图表数据是异步获取的，默认没有数据的时候，整个ReactEcharts元素不渲染

[hustcc]

@Viin-zx 帮忙测试下 v2.0.7 是否解决这个问题（不使用 setTimeout resize 的方法）

@NearTheSeas 有空也帮忙试试 v2.0.7 版本是否解决这个问题！

[Viin-zx]

@hustcc hello, 刚测试了下，2.0.7 还是没有解决那问题

[hustcc]

😢
@Viin-zx 我这边不能复现，忙改还是不好改，你那边有时间，帮忙提个 pr 呗？

[Viin-zx]

@hustcc sorry，我不太懂您啥意思，是帮忙修改bug吗？ 能不能教教我。( Ĭ ^ Ĭ )

[hustcc]

因为你本地可以复现这个问题，可以帮忙修复一下这个问题，然后把代码提交上来。

我这边无法稳定复现问题，很难修复这个问题。

[Viin-zx]

@hustcc 了解了，不好意思第一次弄。。我提交了一个改动，我的问题不会出现了，但不确定这样做是不是最好的。

[hustcc]

@Viin-zx 我在本地复现这个问题，确认下你那边出现这个问题的场景是在异步加载的情况吗？

我们这边是因为异步加载，然后 in-view 判断的时候出现错误，导致 echart 渲染的容器宽高为 0，然后 echarts 渲染的时候自动设置为100px。