how to add a pdf file in React code example

Example 1: react pdf add to existing pdf

<Grid centered columns={2}>
      <Grid.Column textAlign="center" onClick={this.nextPage}>
      
        <Document file='/Sample.pdf' onLoadSuccess={this.onDocumentLoadSuccess} noData={<h4>Please select a file</h4>}>
          <Page pageNumber={pageNumber} >

          </Page>
        </Document>
        {this.state.file ? <p>Page {pageNumber} of {numPages}</p> : null}
      </Grid.Column>
    </Grid>
  </Container>
);

Example 2: how to create a pdf in react

/*
Make sure to install the library
with yarn
yarn add @react-pdf/renderer
with npm
npm install @react-pdf/renderer --save
*/

import React from 'react';
import { Page, Text, View, Document, StyleSheet } from '@react-pdf/renderer';

// Create styles
const styles = StyleSheet.create({
  page: {
    flexDirection: 'row',
    backgroundColor: '#E4E4E4'
  },
  section: {
    margin: 10,
    padding: 10,
    flexGrow: 1
  }
});

// Create Document Component
const MyDocument = () => (
  <Document>
    <Page size="A4" style={styles.page}>
      <View style={styles.section}>
        <Text>Section #1</Text>
      </View>
      <View style={styles.section}>
        <Text>Section #2</Text>
      </View>
    </Page>
  </Document>
);