Skip to content

Commit

Permalink
1. 仅事件变化时只刷新echart绑定的事件;2. 如果style或者className变化,先进行echarts.resize再刷新数…
Browse files Browse the repository at this point in the history
…据更合理
  • Loading branch information
Wang Sen committed Aug 4, 2021
1 parent e261fd8 commit 51dcd3e
Showing 1 changed file with 26 additions and 9 deletions.
35 changes: 26 additions & 9 deletions src/core.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -45,35 +45,41 @@ export default class EChartsReactCore extends PureComponent<EChartsReactProps> {
// 以下属性修改的时候,需要 dispose 之后再新建
// 1. 切换 theme 的时候
// 2. 修改 opts 的时候
// 3. 修改 onEvents 的时候,这样可以取消所有之前绑定的事件 issue #151
if (
!isEqual(prevProps.theme, this.props.theme) ||
!isEqual(prevProps.opts, this.props.opts) ||
!isEqual(prevProps.onEvents, this.props.onEvents)
!isEqual(prevProps.opts, this.props.opts)
) {
this.dispose();

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

// when thoes props isEqual, do not update echarts
const pickKeys = ['option', 'notMerge', 'lazyUpdate', 'showLoading', 'loadingOption'];
if (isEqual(pick(this.props, pickKeys), pick(prevProps, pickKeys))) {
return;
// 修改 onEvent 的时候先移除历史事件再添加
const echartInstance = this.getEchartsInstance();
if (!isEqual(prevProps.onEvents, this.props.onEvents)) {
this.offEvents(echartInstance, prevProps.onEvents);
this.bindEvents(echartInstance, this.props.onEvents || {});
}

const echartsInstance = this.updateEChartsOption();
/**
* when style or class name updated, change size.
*/
if (!isEqual(prevProps.style, this.props.style) || !isEqual(prevProps.className, this.props.className)) {
try {
echartsInstance.resize();
echartInstance.resize();
} catch (e) {
console.warn(e);
}
}

// when thoes props isEqual, do not update echarts
const pickKeys = ['option', 'notMerge', 'lazyUpdate', 'showLoading', 'loadingOption'];
if (isEqual(pick(this.props, pickKeys), pick(prevProps, pickKeys))) {
return;
}

this.updateEChartsOption();
}

componentWillUnmount() {
Expand Down Expand Up @@ -151,6 +157,17 @@ export default class EChartsReactCore extends PureComponent<EChartsReactProps> {
}
}

// off the events
private offEvents(instance, events: EChartsReactProps['onEvents']) {
if (!events) return;
// loop and off
for (const eventName in events) {
if (isString(eventName) && Object.prototype.hasOwnProperty.call(events, eventName)) {
instance.off(eventName);
}
}
}

/**
* render the echarts
*/
Expand Down

0 comments on commit 51dcd3e

Please sign in to comment.