/Javascript/React/How to convert react component to image

How to convert react component to image

import { exportComponentAsJPEG, exportComponentAsPDF, exportComponentAsPNG } from 'react-component-export-image';
import React from 'react';

class ComponentToPrint extends React.Component {
 render() {
   return <div>Hello World</div>;
 }
}
export default class MyComponent extends React.Component {
 constructor(props) {
   super(props);
   this.componentRef = React.createRef();
 }

 render() {
   return (
     <React.Fragment>
       <ComponentToPrint ref={this.componentRef} />
       <button onClick={() => exportComponentAsJPEG(this.componentRef)}>
         Export As JPEG
       </button>
       <button onClick={() => exportComponentAsPDF(this.componentRef)}>
         Export As PDF
       </button>
       <button onClick={() => exportComponentAsPNG(this.componentRef)}>
         Export As PNG
       </button>
     </React.Fragment>
   );
 }
}

Source: npmjs.com

Similar codes

0 vote196 views1 answer
Escaping less than great than signs in react
Javascript React
-1 vote211 views1 answer
How to use error in react hook form
Javascript React
2 votes207 views1 answer
Remove header border react native
Javascript React
5 votes182 views5 answers
Onclick react
Javascript React
0 vote197 views1 answer
How to link a photo in expo react native
Javascript React
0 vote196 views1 answer
Radio button in react native expo
Javascript React
0 vote201 views1 answer
Changing map style react-leaflet
Javascript React
3 votes191 views1 answer
How to go to another page onclick in react
Javascript React
0 vote191 views1 answer
Change candle color react highcharts
Javascript React
9 votes248 views1 answer
How to create a react app in current folder
Javascript React