wonday / react-native-pdf

A <Pdf /> component for react-native
MIT License
1.6k stars 557 forks source link

Multiple pdf files in a Flatlist rendered partially #764

Closed alex-dev05 closed 1 year ago

alex-dev05 commented 1 year ago

What react-native version are you using?

What platform does your issue occur on? (android/ios/both)

Describe your issue as precisely as possible :

I am trying to render multiple PDF files one after another using a flatlist. The problem is that only the first one/two pages are rendered of each pdf. Has anyone tried to render multiple PDF files one after another? If I render only one pdf the behavior is the expected one, all the pages are rendered.

main component

<View style={{flex: 1}}> <FlatList data={pdfs} keyExtractor={(item, index) => index.toString()} renderItem={({ item, index }) => ( <PdfViewer source={item.source} onPdfFinalPage={handlePdfFinalPage} onPdfPageChange={(page, numberOfPages) => { handleOnPdfPageChange(page); }} onLoadComplete={() => { handlePdfOnLoadComplete(); }} /> )} />

PdfViewer component: return ( <Pdf trustAllCerts={false} source={source} showsVerticalScrollIndicator={false} enablePaging={false} onLoadComplete={(numberOfPages, filePath) => { handleOnComplete(); console.log('pdf loaded'); }} onPageChanged={(page, numberOfPages) => { console.log(current page: ${page}); handlePageChange(page, numberOfPages); }} onError={error => { console.log(error); }} onPressLink={uri => { console.log(Link pressed: ${uri}); }} onLoadProgress={percent => { console.log(Loading progress: ${percent}); }} style={{ height, width, backgroundColor: Colors.white, flex: 1, alignSelf: 'stretch', }} />