Search code examples
reactjspdf.jsreact-pdf

react-pdf onItemClick is not working


I am using react-pdf to show the pdf document. left i am showing pages preview when we click on the page i am showing the page content in the seperate section. For that i am using onItemClick event. But which is not getting triggered.

Below is the code sample

onPageClick = ({ pageNumber }) => {
    alert('Clicked an item from page ' + pageNumber + '!')
}

 let display = [1,2,3,4,5].map((page, index) => {
        return (<Page key={index} onItemClick={this.onPageClick} pageNumber={index + 1} scale={1.0} width={100} />)
    });

<Document  file={this.state.fileDatapdf}               

           > {display}</Document>

Solution

  • Below is the solution which i got finally.

    I have put one div in between document and page and added click event to the div.

       <Document    file={file}
                                                loader={loader}
                                                onItemClick={this.onPageClick}
                                                onLoadSuccess={this.onDocumentLoad}>
                                                <div className='highlighed-pdf'>
                                                    <Page onItemClick={this.onPageClick} pageNumber={this.state.openedPageNo} scale={2} width={480} />
                                                </div>
                                            </Document>
    

    Hope this will help one or other :)

    This is the github issue tracker.

    enter link description here

    still it is open