React-Native笔记--react-native-pdf

唐裕
2023-12-01

项目中使用到pdf文件查看,简单记录;

添加依赖:

npm install react-native-pdf --save
 或
yarn add react-native-pdf

依赖后需要:

 react-native link react-native-pdf

主要代码:

 <View style={styles.container}>
                        <Pdf  source={source}
                    fitPolicy={2} // 0:宽度对齐,1:高度对齐,2:适合两者(默认)
                    onLoadComplete={(numberOfPages,filePath,width,height,tableContents)=>{
                        console.log(`number of pages: ${numberOfPages}`); //总页数
                    }}
                    onPageChanged={(page,numberOfPages)=>{
                     //页面变化时会触发
                    }}
                    onError={(error)=>{
                        console.log(error);
                    }}                 
                    spacing={10} // 页面之间的间隔大小,默认为 10
                    horizontal={true} //横向
                    enableAntialiasing={true} //在低分辨率屏幕上改进渲染
                    enableRTL={false} //倒序滑动
                    enableAnnotationRendering={true} //启用渲染注视
                    onLoadProgress={(number)=>console.log(number)} //加载时回调,返回加载进度(0-1)
                    onPageSingleTap={()=>{
                        console.log('页面被点击的时候回调')
                    }}
                    onScaleChanged={()=>{
                        console.log('页面缩放的时候回调')
                    }}
                    style={styles.pdf}></Pdf>
                    </View>

 

 类似资料: