component doesn't render

[kristkirp]

Hi i have following versions:

"devDependencies": {
"jest-expo": "27.0.0",
"react-native-scripts": "1.11.1",
"react-test-renderer": "16.2.0"
},
"dependencies": {
"expo": "^27.0.0",
"react": "^16.3.1",
"react-native": "^0.55.4"
}

"expo": {
"sdkVersion": "27.0.0",
}

The component doesn't give any error just nothing. The problem is not in uri/base64 they are fine, i tried uri from your example

This is the code:
KeyboardAvoidingView keyboardVerticalOffset={80} behavior="padding" style={{ flex: 1 }}
ScrollView style={{ flex: 1 }}
View style={{ flex: 1,
paddingTop: Constants.statusBarHeight}}>
<PDFReader
source={{ uri: "http://gahp.net/wp-content/uploads/2017/09/sample.pdf" }}
/>
View
ScrollView
KeyboardAvoidingView

Thank you

upd: the full code not displayed i don't know why, it displays only in edit mode

[xcarpentier]

What do you mean by display only on edit mode?

[kristkirp]

I updated code in questions, had to remove "<" and "/>" because it doesn't show fully with with them

[kristkirp]

So my PDFReader is inside View, ScrollView, KeyboardAvoidingView

[xcarpentier]

iOS or android ?
On device or emulator ?
If you use it only into <View/> does it works?

For now I recommend to use this component in full screen.

[xcarpentier]

Can you provide a screenshot?

[kristkirp]

When it is wrapped in just a View it works! Thank you for help! :)

[xcarpentier]

Close and add in FAQ: https://github.com/xcarpentier/rn-pdf-reader-js#faq

[Sanj98]

Hi
The component does not render and your index.js file throws errors as below
which says "[js] 'types' can only be used in a .ts file."

PLEASE HELP ME OUT

Hi there, I keep getting this error:
"console.error: Unable to get result of file due to bad type, waiting string and getting object."
Could some assist please? I will provide more info if needed.

This is what is pass to the PDFReader:

<PDFReader
source={{ uri: "http://gahp.net/wp-content/uploads/2017/09/sample.pdf" }}
/>

My package.json:
{
"name": "empty-project-template",
"main": "node_modules/expo/AppEntry.js",
"private": true,
"scripts": {
"start": "expo start",
"android": "expo start --android",
"ios": "expo start --ios",
"eject": "expo eject"
},
"dependencies": {
"axios": "^0.18.0",
"expo": "^31.0.6",
"lodash": "^4.17.11",
"moment": "^2.22.2",
"moment-timezone": "^0.5.23",
"native-base": "^2.8.1",
"prop-types": "^15.6.2",
"react": "16.5.0",
"react-moment": "^0.8.4",
"react-native": "https://github.com/expo/react-native/archive/sdk-31.0.0.tar.gz",
"react-native-datepicker": "^1.7.2",
"react-native-fetch-blob": "^0.10.8",
"react-native-modal-dropdown": "^0.6.2",
"react-native-popup-dialog": "^0.16.6",
"react-native-vector-icons": "^6.0.2",
"react-navigation": "^2.17.0",
"react-redux": "^5.0.7",
"redux": "^4.0.0",
"redux-thunk": "^2.3.0",
"rn-pdf-reader-js": "^0.1.7"
}
}

[fabiendeborde]

I am having the same issue as the one described above.
The code was working a few weeks ago and today when I came back to debug another part of the app I realized the PDF Reader was broken.
I tried to render the code below instead to be sure I didn't mess something with my URI but I still code the same error message.
<PDFReader source={{ uri: 'http://gahp.net/wp-content/uploads/2017/09/sample.pdf' }} />

Could it be related to the upgrade to expo 31?

[thiagosouzasi]

Hello guys, I solved the display problem by adding the following code inside the styles

pdf: {
width: Dimensions.get ('window'). width,
height: Dimensions.get ('window'). height,
},

[Jayeshkarma]

`import React, { memo } from 'react';
import { View, StyleSheet, Dimensions } from 'react-native'
import PDFReader from 'rn-pdf-reader-js'
const LearningScreen = props => {

return( 
  <View style={styles.container}> 
    <PDFReader style={styles.pdf}
      source={{
        uri: 'http://gahp.net/wp-content/uploads/2017/09/sample.pdf',
      }}
    />
  </View> 
)

}
const styles = StyleSheet.create({
container:{
justifyContent:'center',
flex:1,

      backgroundColor:'red'
  },

  pdf: {
    width: Dimensions.get ('window'). width,
    height: Dimensions.get ('window'). height,
    backgroundColor:'#000'
    },
});

export default memo(LearningScreen);`

not showing anything on screen please help me to solve it

[xTurbeaux]

does anyone use the headers? cant get mine to track to the desired destination set on the pdf, honestly Im not even sure if I have this configured properly

<View style={{width: '100%', height: '100%'}}>
<PDFReader
source={{
uri: 'http://10.1.10.167:5501/docs/Product_Guide_2020.pdf#hearth',
headers: { ['hearth']: 'http://10.1.10.167:5501/docs/Product_Guide_2020.pdf#hearth' }
}}
/>