I followed some answers from here that are similar to my issues. But unfortunately, the error is not removed. That is why I asked here again.
This is an old versioned React Native
project where react-native-document-picker
version was 2.1.0
. When I upgraded the version to 8.0.0
, the error shows as the following screenshot:
The current files are as like below;
android/settings.gradle
...
include ':react-native-document-picker'
project(':react-native-document-picker').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-document-picker/android')
...
android/app/build.gradle
dependencies {
implementation fileTree(dir: "libs", include: ["*.jar"])
...
...
implementation project(':react-native-document-picker')
}
package.json
{
"name": "awesomeproject",
"version": "0.0.1",
"private": true,
"scripts": {
"android": "react-native run-android",
"ios": "react-native run-ios",
"start": "react-native start",
"test": "jest",
"lint": "eslint ."
},
"dependencies": {
"@react-native-community/datetimepicker": "^6.0.2",
"@react-navigation/drawer": "^6.3.1",
"@react-navigation/native": "^6.0.8",
"@react-navigation/stack": "^6.1.1",
"axios": "^0.26.1",
"moment": "^2.29.1",
"native-base": "^3.3.7",
"react": "17.0.2",
"react-native": "0.67.2",
"react-native-action-button": "^2.8.5",
"react-native-document-picker": "^8.0.0",
"react-native-dropdownalert": "^4.5.1",
"react-native-fcm": "^16.2.4",
"react-native-fetch-blob": "^0.10.8",
"react-native-fs": "^2.19.0",
"react-native-gesture-handler": "^2.3.2",
"react-native-image-picker": "^4.7.3",
"react-native-iphone-x-helper": "^1.3.1",
"react-native-keyboard-aware-scroll-view": "^0.9.5",
"react-native-keyboard-spacer": "^0.4.1",
"react-native-loading-spinner-overlay": "^3.0.0",
"react-native-modal-datetime-picker": "^13.1.0",
"react-native-modalbox": "^2.0.2",
"react-native-reanimated": "^2.4.1",
"react-native-safe-area-context": "^4.1.2",
"react-native-screens": "^3.13.0",
"react-native-simple-radio-button": "^2.7.4",
"react-native-simple-toast": "^1.1.3",
"react-native-svg": "^12.3.0",
"react-native-swiper": "^1.6.0",
"react-native-vector-icons": "^9.1.0",
"react-redux": "^7.2.6",
"redux": "^4.1.2",
"redux-logger": "^3.0.6",
"redux-saga": "^1.1.3"
},
"devDependencies": {
"@babel/core": "^7.12.9",
"@babel/runtime": "^7.12.5",
"@react-native-community/eslint-config": "^2.0.0",
"babel-jest": "^26.6.3",
"eslint": "7.14.0",
"jest": "^26.6.3",
"metro-react-native-babel-preset": "^0.66.2",
"react-test-renderer": "17.0.2"
},
"jest": {
"preset": "react-native"
}
}
app.js
import {DocumentPicker, DocumentPickerUtil} from 'react-native-document-picker';
pressOnAttach() {
Keyboard.dismiss();
this.refs.NoticeTitle.blur();
this.refs.NoticeDescription.blur();
setTimeout(() => {
DocumentPicker.show({
filetype: [DocumentPickerUtil.allFiles()],
}, (error, res) => {
if (error === null) {
setTimeout(() => {
if (!this.checkFileExtension(res.fileName)) {
alert(AppText.VALID_EXTENSION_MESSAGE)
} else {
this.generateList(res.uri, res.fileName, res.fileSize);
}
}, 1000)
}
});
}, 1000)
}
When I console.log
the DocumentPicker
and DocumentPickerUtil
, it returns undefined
always.
Could anyone help me please to fix this issue? Thanks in advance!
CodePudding user response:
The reason you are getting DocumentPicker undefined is the react-native-document-picker
version 8.0.0
has been updated since version 2.1.0
which code you've posted.
According to the library doc, you have to import the DocumentPicker differently. And the util DocumentPickerUtil is also not available to the updated version. For react-native-document-picker
version 8.0.0
you have to import in the following way
import DocumentPicker, { types } from 'react-native-document-picker';
And also DocumentPicker.show
method is no longer available you have to use the DocumentPicker.pick
method.
Ref: