hustcc / echarts-for-react

⛳️ Apache ECharts components for React wrapper. 一个简单的 Apache echarts 的 React 封装。
https://git.hust.cc/echarts-for-react
MIT License
4.56k stars 633 forks source link

当添加事件onEvents之后,刷新数据render的时候会重新渲染整个图表 #286

Closed alecthw closed 5 years ago

alecthw commented 5 years ago

如题。 使用echarts-for-react和使用原生echarts对比结果如下: https://codesandbox.io/embed/x389rn0n2q

alecthw commented 5 years ago

找到原因了: 这么写的话会导致每次渲染都重建

onEvents={{
  click: params => {
    console.log(params);
  }
}}

源码判断逻辑如下:

    if (
      prevProps.theme !== this.props.theme ||
      !isEqual(prevProps.opts, this.props.opts) ||
      !isEqual(prevProps.onEvents, this.props.onEvents)
    ) {
      this.dispose();

      this.rerender(); // 重建
      return;
    }

不知道这个地方能不能优化。。。

SidKwok commented 5 years ago

你这样每次传入的东西就是一个新的对象,逻辑判断上面没有问题

wb121017405 commented 3 years ago

如果我给每个图表存储了一个ID,点击事件想要吧这个ID当参数传进方法就很难🤣 ( id chart( click func) )