Zhang Zhuo / ObjectEVEComponents

  import React,{Component} from 'react';
  import ReactDOM from 'react-dom';

  import { FlvCom ,Timer,ImgCom,AreaSelete,FunAreaSelect} from "./components/index"

  // import {FlvCom,Timer,ImgCom,AreaSelete} from "../dist/index.js"

  class App extends Component{

      constructor(){
          super();
          this.state = {
              imgUrl:"C:/imagelib/imgalarm/2020/12/21/192.168.166.155/192.168.166.155_00_20201221181716755_ALARM_210_9891_HEL_SNAP.jpg",

              serviceData: [[20, 15], [20, 80], [100, 50],[300, 50]],

              serviceData2:[]
          }
      }
      clickIt(){
  
          this.setState({
              serviceData2:[[20,21],[20,80]]
          })
      }
      change(val){

          // console.log(val)

      }

      render(){

          let {imgUrl,serviceData,serviceData2} = this.state;

          return (
              <div style={{

                  width: "500px", height: "500px"

              }}>

                  <button onClick={()=>this.clickIt()}>切换</button>
                  <div style={{width:"81.2%",height:"80%"}}>

                      {/* <FunAreaSelect></FunAreaSelect> */}

                      <AreaSelete serviceData={serviceData} change={(val)=>this.change(val)}></AreaSelete>
                      {/* <AreaSelete ref={(inst) => { this.myRef = inst } } serviceData={serviceData2} change={(val)=>this.change(val)}></AreaSelete> */}
                  </div>
                  {/* <ImgCom httpImg="http://112.125.25.140:8083/syboxms/getImgDataByPath"  imgUrl={imgUrl}></ImgCom> */}
                  {/* <FlvCom vidoeUrl=""></FlvCom>
                  <Timer className="timerComCssss" type="YYYY-MM-DD HH:mm:ss"></Timer>  */}
                  

              </div>
          )
      }
  }
  
  ReactDOM.render(<App />, document.getElementById('root'));