Load more than 1 pdf pages

[iamrkcheers]

I am building a project in React that has a functionality of displaying pdfs.
I am using the basic minimal code provided in the example (in the repo) itself.
However, the code displays only the first page of the pdf and the rest are ignored.

Following is my code ..

import React, {Component} from 'react';
import './DocumentationPage.css';
import HeaderComponent from '../../components/Header/Header.js';
import { Document, Page } from 'react-pdf/build/entry.webpack';
import data from './data.pdf';
// import { Document, Page } from 'react-pdf';

export default class DocumentationPage extends Component {
    state = {
        numPages: 12,
        pageNumber: 1,
      }

    render() {
        const { pageNumber, numPages } = this.state;

        return (
            <div>
                <HeaderComponent id='header' location={this.props.location} />
                <div>
                    <h1>Documentation</h1>
                </div>
                <div id='contentDiv'>
                    <Document
                        file={data}
                        onLoadSuccess={this.onDocumentLoad}>
                            <Page pageNumber={pageNumber} />
                    </Document>
                    <p>Page {pageNumber} of {numPages}</p>
                </div>
            </div>
        );
    }
}

Please help.
Thank You.

[wojtekmaj]

Well, you've put one <Page> inside <Document>. Therefore, you got one page. ;) Please see ./sample directory for a simplest possible example of dynamic rendering of multiple pages.

[iamrkcheers]

Yup, silly me !
Anyway, thanks for the help.

[wojtekmaj]

Pleasure! If you need help with anything else, let me know.

[hosseinmp76]

Well, you've put one <Page> inside <Document>. Therefore, you got one page. ;) Please see ./sample directory for a simplest possible example of dynamic rendering of multiple pages.

as I saw in sample I have to add all the pages handy to see all pages. is there other way to load all pdf? I think there should be a way that pdf-react handle this. for example load all pages if we don;t use <page as its child.

[wojtekmaj]

That would be a breaking change. A non-breaking solution would be to create <AllPages /> component or something similar. Which is not a bad idea :)

[hosseinmp76]

That would be a breaking change. A non-breaking solution would be to create <AllPages /> component or something similar. Which is not a bad idea :)

may you make a new issue for it?