Follow

Keep Up to Date with the Most Important News

By pressing the Subscribe button, you confirm that you have read and are agreeing to our Privacy Policy and Terms of Use
Contact

Path to a file React Native

I have a pdf file in /assets/pdfs folder. I’m trying to display it but getting an empy page:

import React from 'react';
import { StyleSheet, View, Text } from 'react-native';
import Pdf from 'react-native-pdf';
import MaterialIcon from 'react-native-vector-icons/MaterialIcons';
import Feather from 'react-native-vector-icons/Feather';

import Main from '../Main'

var RNFS = require('react-native-fs');

export default function ItalyUserAgreement({ navigation }) {
    const source = {uri: 'file://' + RNFS.DocumentDirectoryPath + '/assets/pdfs/thereactnativebook-sample.pdf'}
    console.log(source)

    return (
        <View style={styles.container}>
            <View style={styles.appBar}>
                <MaterialIcon name="arrow-back" size={32} color="#ffffff" backgroundColor={'none'} onPress={() => navigation.goBack()} />
                <Text style={styles.appBarText}>Italy</Text>
                <Feather name="x" size={32} color="#ffffff" backgroundColor={'none'} onPress={() => navigation.navigate(Main)} />
            </View>
            <Pdf
                source={source}
                style={styles.pdf}
            />
        </View>
    )
}

I’ve also tried:

const source = {uri: 'file://assets/pdfs/thereactnativebook-sample.pdf'} 

and

MEDevel.com: Open-source for Healthcare and Education

Collecting and validating open-source software for healthcare, education, enterprise, development, medical imaging, medical records, and digital pathology.

Visit Medevel

const source = require('/assets/pdfs/thereactnativebook-sample.pdf')

But none of those worked for me

>Solution :

These are all the possible ways as stated in the docs:

// const source = { uri: 'http://samples.leanpub.com/thereactnativebook-sample.pdf', cache: true };
// const source = require('./test.pdf');  // ios only
// const source = {uri:'bundle-assets://test.pdf' };
// const source = {uri:'file:///sdcard/test.pdf'};
// const source = {uri:"data:application/pdf;base64,JVBERi0xLjcKJc..."};
// const source = {uri:"content://com.example.blobs/xxxxxxxx-...?offset=0&size=xxx"};
// const source = {uri:"blob:xxxxxxxx-...?offset=0&size=xxx"};
Add a comment

Leave a Reply

Keep Up to Date with the Most Important News

By pressing the Subscribe button, you confirm that you have read and are agreeing to our Privacy Policy and Terms of Use

Discover more from Dev solutions

Subscribe now to keep reading and get access to the full archive.

Continue reading