在Html寫好的HighChart，遷移入react Ant框架中使用

失敗的方法：

// 方案一：
    /*
      { typeof pvUvData.data !=='undefined' ? HighChartShow(pvUvData) : (<div id="highChart1">111</div>)}
      const HighChartShow=(data)=>{
        if(typeof data.data !=='undefined'){
         getData1(Highcharts,HighchartsTheme,data,'highChart1','size')
        }
      } 
      return;
    */
    // 方案二：
    /*
      <HighChartShow id="highChart1" data={pvUvData} />
      const HighChartShow=(id,data)=>{
        if(typeof id.data.data !=='undefined'){
          console.log('--------------',id.data)
          return getData1(Highcharts,HighchartsTheme,id.data,id.id,'size')
        }else{
          return (<div id={id.id} ></div>)
        }
      } 
      return;
    */

成功的方法：

寫成獨立組件：
import HighChart1 from './HightChartPvUv';

return （<div id="highChart1"></div>
 {typeof pvUvData.data !='undefined'? (<HighChart1 id="highChart1" data={pvUvData.data}  type="size" />) :'' }
）


HightChartPvUv.js


'use strict';
import React from 'react';
const Highcharts = require('highcharts'); 
import HighchartsTheme from './HighchartsTheme';

export default class HighChart1 extends React.Component {
    render() {
        const {
          id,
          data,
          type,
        } = this.props; 

    原遷入的代碼放這裏
    .....

    return (
            ''
        );
    }
}