一个html引入多个柱状图,用引入react及echart的方式做了一个页面，页面有多个图表，每一个图表都是一个组件...

多个图表只要避免覆盖掉 window.onresize 方法就行了。

当然多个组件批处理的话，不妨写个高阶组件封装一下。

const ChartWrapper = ChildComponent => class extends Component {

componentDidMount() {

if (window) {

const onresize = window.onresize;

window.onresize = () => {

if (onresize) onresize();

this.child.resize();

};

}

}

render() {

return (

{ this.child = child; }} />

);

}

};

export default ChartWrapper;

然后确保每个子组件内部实现 resize 方法。

class Line extends Component {

resize = () => {

// myChart.resize();

};

}

export default ChartWrapper(Line);

//

class Bar extends Component {

resize = () => {

// myChart.resize();

};

}

export default ChartWrapper(Bar);