博客

问题描述

在组件中配置事件后，变更option状态，图标竟然闪烁更新，而且更新同组件内部的其他状态时，图标也闪烁~我的妈呀，这让客户看到，直接提bug啊！网上所搜了大半天，没有明确的答案，好吧，可能这个问题比较low，但对于我来说是个新鲜事儿，记录一下，防止复发。。。

问题代码

<ReactEcharts
  className={styles.barBox}
  option={this.getBarOption(barData)}
  ref={(e) => {
    this.echartsReact = e;
  }}
  // onEvents={{ click: (e) => this.onBarClick(e) }}
  onChartReady={(e) => this.onChartReadyCallback(e)}
  // lazyUpdate={true}
  notMerge={true}
// theme={'theme_name'}
// onChartReady={this.onChartReadyCallback}
// opts={}
/>

在绑定onEvents后出现的问题，网上偶尔有帖子讨论这个问题，纠结在notMerge上，what，明显不是一个问题好不好！

正解

通过onChartReady回调，拿到实例去绑定事件，这样曲线救国了，暂时还不明白什么原因，考虑是每次更新图标，通过onEvents的话，图标组件内部重新渲染图标去绑定事件了，暂时这样解决，先交差再说，溜了~