react-print-component v0.1.8

React Print Component

Print your component!

Arguments

Example Usage

1. Add <PrintComponent /> Element to your root element

   ...
   
   render() {
       return (
           <div>
               <PrintComponent />
               <div className="main-root"></div>
           </div>
       );
   }
   
   ...

2. Use static functions to print your components.

   import PrintComponent from 'react-print-component';
   
   export class TestComponent() {
   
       ...
   
       onPrintButtonClick() {
           //Replace components added
           PrintComponent.SetPrintContent(this.render());
           //Add components to list
           PrintComponent.AddPrintContent(this.render());
           PrintComponent.AddPrintContent(<div>{"Mulit element"}</div>);
           //Clear all added components in list
           PrintComponent.ClearComponent();
           ...
           do something
           ...
   
           //Call this method to print
           PrintComponent.Print();
       }
   
       ...
   }

3. Write print style in @media

       @media print {
           
           ...
           
           h1 {}
           h2 {}
           button {}
           input[type=text] {}
   
           ...
       }