集成react-native-image-picker时,报错Couldn't get file path for photo

1. 版本环境:

"react": "16.13.1",
"react-native": "0.63.2",
"react-native-image-picker": "^2.3.3",
targetSdkVersion: 29。

问题还出现在:Android 10/ API 29..

2.出问题时代码:

<TouchableOpacity 
      style={styles.addBtn}
      onPress={() => this.addImages(options)}>
      <Text style={styles.addText}>添加照片</Text>
</TouchableOpacity>
addImages = (options) => {
        let { imgUrlArray } = this.state;
        let length = imgUrlArray.length;
        console.log(length)
        if(length === 9) {
            return;
        }

        ImagePicker.showImagePicker(options, (response) => {
            
            console.log('Response = ', response);
            
            if (response.didCancel) {
                console.log('User cancelled image picker');
            } else if (response.error) {
                console.log('ImagePicker Error: ', response.error);
            } else if (response.customButton) {
                console.log('User tapped custom button: ', response.customButton);
            } else {
                const source = { uri: response.uri, id: length + 1 + '' };
                
                // You can also display the image using data:
                // const source = { uri: 'data:image/jpeg;base64,' + response.data };
                imgUrlArray.push(source)
                this.setState({
                    imgUrlArray: imgUrlArray,
                });
            }
        });
    }

点击后无反应,但是进入了函数。

3.解决方法:

方案一:

  android/app/src/main/AndroidManifest.xml    在application标签中加入  

  android:requestLegacyExternalStorage ="true"

  这个办法,能够应用短期修复程序来解决此问题

  我认为这是由于Android 10范围内的存储隐私更改所致,并且将需要更新该库以及它如何从文件系统读取/写入。但是我的Android开发经验非常有限。

方案二:
import { PermissionsAndroid } from “react-native”
    
    
    //功能函数中加入...     const granted
= await PermissionsAndroid.request( PermissionsAndroid.PERMISSIONS.WRITE_EXTERNAL_STORAGE, { title: 'We need your permission' }, ); if (granted === PermissionsAndroid.RESULTS.GRANTED) { console.log('You can use the camera'); ImagePicker.showImagePicker(options, async (response) => { if (response.didCancel) { console.log('User cancelled image picker'); } else if (response.error) { console.log('ImagePicker Error: ', response.error); console.log(response); } else if (response.customButton) { console.log('User tapped custom button: ', response.customButton); } else { const source = { uri: response.uri }; } }); } else { console.log('Camera permission denied'); }

 

posted @ 2020-09-04 17:42  游丝飘榭  阅读(691)  评论(0编辑  收藏  举报