REACT打印页面组件

REACT打印页面组件

Posted by Teemo on April 29, 2020
import React from 'react';
import PrintTicketContent from '../common/PrintTicketContent'
import { Modal, message, Row, Col, Button } from 'antd';

class Print extends React.Component {
  //打印方法
  handlePrint = (printState) => {
      if (printState != undefined && printState != null && printState) {
        window.document.body.innerHTML = window.document.getElementById('printHtml').innerHTML;//获取要打印的页面内容
        if(document.execCommand("print")){
          let data = service.printTicketFlagsHW(this.props.nid);
          console.log(data)
          data.then((data)=>{
             if(data.data.result){
               window.location.reload();
             }else{
               Modal.error({ title: intl.get('WrongMessage'), content: data.data.info});
             }
           }
          )
          }
      }

    
  }
  
  render() {
    const { data } = this.props;//打印内容
    return (
      <div>
        <Row>
          <Col span={24}>
            <Col span={20}/>
            <Col span={2}>
              <Button onClick={()=>this.handlePrint(data)} disabled={!this.props.btndisabled}>打印</Button>
          </Col>
          </Col>
        </Row>
      <div id={'printHtml'}>
   {data}
      </div>
      </div>
    );
  }
}

export default Print;