javascript - 选择文档后，react-native-document-picker 应用程序关闭/崩溃

Question

React 本地学习器在这里。我正在尝试在我的应用程序中实现一个 react-native-document-picker。这是我从教程中提取的简单实现: https://aboutreact.com/file-picker-in-react-native/amp/

理想情况下应该完美运行。这是大大简化的最小运行代码:

const MyDocumentPicker = () => {
  const [singleFile, setSingleFile] = useState('');
  const [multipleFile, setMultipleFile] = useState([]);

  const selectOneFile = async () => {
    //Opening Document Picker for selection of one file
    try {
      const res = await DocumentPicker.pick({
        type: [DocumentPicker.types.allFiles],
      })
      .then((resolve) => {console.log("Resolve: ", resolve)
        var res1 = resolve;
        setSingleFile(res1);
        console.log('res : ' + JSON.stringify(res)); //correct output
        console.log('URI : ' + res.uri); //outputs: content://com.android.providers.media.documents/document/image%3A25
        console.log('Type : ' + res.type); //outputs: image/jpeg
        console.log('File Name : ' + res.name); //outputs: 
        console.log('File Size: ' + res.size); //outputs: 199923
        console.log('singleFile STATE: ', singleFile); //outputs: ""
        console.log('singleFile STATE TYPEOF: ', typeof singleFile); //outputs: string
        console.log('singleFile STATE LENGTH: ', singleFile.length);  //outputs:  0
      })
      .catch((reject) => console.log("Reject: ", reject));
      
    } catch (err) {
      console.log("Exception error: ", err);
      //Handling any exception (If any)
      if (DocumentPicker.isCancel(err)) {
        //If user canceled the document selection
        alert('Cancelled from single doc picker');
      } else {
        //For Unknown Error
        alert('Unknown Error: ' + JSON.stringify(err));
        throw err;
      }
    }
  };

  return (
    <SafeAreaView style={{flex: 1}}>
      {(<View>
      <Text style={styles.titleText}>
        Example of File Picker in React Native
      </Text>
      <View style={styles.container}>
        {/*To show single file attribute*/}
        <TouchableOpacity
          activeOpacity={0.5}
          style={styles.buttonStyle}
          onPress={selectOneFile}>
          {/*Single file selection button*/}
          <Text style={{marginRight: 10, fontSize: 19}}>
            Click here to pick one file
          </Text>
          <Image
            source={{
              uri: 'https://img.icons8.com/offices/40/000000/attach.png',
            }}
            style={styles.imageIconStyle}
          />
        </TouchableOpacity>
        {/*Showing the data of selected Single file*/}
        <Text style={styles.textStyle}>
          File Name: {singleFile.name ? singleFile.name : ''}
          {'\n'}
          Type: {singleFile.type ? singleFile.type : ''}
          {'\n'}
          File Size: {singleFile.size ? singleFile.size : ''}
          {'\n'}
          URI: {singleFile.uri ? singleFile.uri : ''}
          {'\n'}
        </Text>
        <View
          style={{
            backgroundColor: 'grey',
            height: 2,
            margin: 10
          }} />
      </View>
      </View>)}
    </SafeAreaView>
  );
};
...
<MyDocumentPicker/>
...
styling
...

输出类似于控制台调试器: 该应用程序的行为是:一旦选择图像/文档，它就会崩溃/自行关闭。

看起来，当我点击 Click here to pick one file 并选择一个图像/文档时，函数 selectOneFile() 成功执行并完成所有操作 console.log() 如图所示，然后控制从应用程序退出。

我的环境详情:在 Android 模拟器上测试。

“ react ”:“16.13.1”，

“ native react ”:“0.63.2”，

"react-native-document-picker": "^4.1.0",

在 AndroidManifest.xml 中我添加了:

<uses-permission android:name="android.permission.CAMERA"/>
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE"/>
<uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE" />

任何方向，可能是什么原因。最近 2 天一直处于这种情况。

Answer 1

我在选择文件时也遇到了同样的崩溃问题。检查你的包 JSON 文件，尝试一个一个地删除插件并测试文档选择器。在我的情况下，react-native-upi-payment 导致了这个问题。