/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

3 votes236 views1 answer
React js image path src from local folder
Javascript React
6 votes243 views2 answers
Google sign up react npm
Javascript React
0 vote228 views1 answer
Yarn add react-native-elements
Javascript React
1 vote242 views1 answer
Unexpected token react native stack navigation
Javascript React
0 vote254 views1 answer
React Native - Trigger Media Scanner
Javascript React
0 vote255 views1 answer
Reactjs download file axios
Javascript React
0 vote259 views1 answer
React yup password with number string and uppercase
Javascript React
4 votes241 views2 answers
React multiple select dropdown
Javascript React
1 vote243 views1 answer
Module '"../../../node_modules/react-native"' has no exported member 'View'
Javascript React
-2 votes260 views1 answer
Fc in react
Javascript React