在webpack中使用echarts， Cannot read property 'getAttribute' of null的问题

本文是在react 框加使用，如果直接复制官方的代码会有两个问题。

• 一个是dom没有获取到，可以先放在useEffect中或者componentDidMount里
• 另一个是var myChart = echarts.init(document.getElementById('main')); 获取到我们的元素，
  在不同的框架里面获取元素的方法不同，也是一个注意点
• 如果是在html文件里，要把js文件放在dom元素下面否则也是页面加载的时候没有获取到dom元素。
• 或者把代码放在window.onload = () => {}也是可以的

import React, { useEffect } from 'react';
function App() {
    useEffect(() => {
        getEcharts()
    }, [])
   
    function getEcharts() {
        var echarts = require('echarts');
        var myChart = echarts.init(document.getElementById('main'));
        myChart.setOption({
            tooltip: {
                trigger: 'axis'
            },
            yAxis: {
                type: 'value'
            },
            xAxis: {
                type: 'category',
                boundaryGap: false,
                data: ['周一', '周二', '周三', '周四', '周五', '周六', '周日']
            },
            series: [{
                data: [820, 932, 901, 934, 1290, 1330, 1320],
                type: 'line',
                smooth: true,
                name: '联盟广告',
                label: {
                    normal: {
                        show: true,
                        position: 'top'
                    }
                },
            }]
        });
    }
    return (
        

        
    )
}
export default App;