首页 > 解决方案 > how to set A5 page size in react-to-print

问题描述

I usually use react-to-print for printing react components with a low effort and great flexibility. I want to set page size in my react-project.

This is my code:

const Invoice = (props) => {

var clientInfo = JSON.parse(localStorage.getItem('clientInfo'));
var date = new Date().getDate(); //Current Date
var month = new Date().getMonth(); //Current Month
var year = new Date().getFullYear(); //Current Year
var months = ['Jan','Feb','March','April','May','June','July','Aug','Sep','Oct','Nov','Dec']

var fullDAte = months[month]+'-'+date+'-'+year
// console.log("printing forr ----------->================", fullDAte );
var docTitle = clientInfo.clientName +'_Date_' +fullDAte

const componentRef = useRef();    
const handlePrint = useReactToPrint({
  content: () => componentRef.current,
  documentTitle: docTitle,

});

return (
  <div class="printBtn-container">
    <PrintPage ref={componentRef} />
    <div className="printBtnStyling">
    <button className="printBtn" onClick={handlePrint}>Print this out!</button>
    <button className="printBtn" onClick={()=>{props.history.goBack()}}>Make New Invoice</button>
    </div>
  </div>
);

};

this is my main component that i want to print or save as pdf:

const PrintPage =  React.forwardRef((props, ref) => {
           

          ----My Compoenent code here----

 })

and i import this for whole project

import { useReactToPrint } from 'react-to-print';

kindly guide me how to do page size setting

标签: reactjsreact-pdfreact-to-print

解决方案


推荐阅读