只需要修改componentDidMount中加入setTimeout(()=>{echarts代码});
import React, {Component} from 'react';
import "./Main.css"
// 引入 ECharts 主模块
// @ts-ignore
import * as echarts from "echarts"
class Main extends Component {
componentDidMount() {
setTimeout(() => {
// 基于准备好的dom,初始化echarts实例
// @ts-ignore
let myChart = echarts.init(document.getElementById('main'));
window.addEventListener('resize', () => {
console.log('resize')
myChart.resize()
})
// 绘制图表
let option = {
....
};
myChart.setOption(option);
})
}
componentWillUnmount = () => {
// @ts-ignore
let charts = echarts.init(document.getElementById('main'));
charts!.clear();
charts!.dispose();
window.onresize = null;
}
render() {
return (
<div id="main" className="Main"></div>
);
}
}
export default Main;