从 react-native-image-picker 中选择后不显示图像

Question

我正在开发一个应用程序，我需要在其中从手机上传图像，一旦我点击上传库，就会显示并且我能够选择图像，但是一旦选择图像，图像就不会显示在图像容器中 i用过。

我的代码

这是selectImage函数

selectImage = () => {
        const options = {
            title: 'Select Profile Picture',
            storageOptions: {
                skipBackup: true,
                path: 'images',
            },
        };
        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);
                Alert.alert(response.error.toString())
            } else if (response.customButton) {
                console.log('User tapped custom button: ', response.customButton);
            } else {
                //let source = { uri: response.uri };
                Alert.alert(response.uri)
                let source = { uri: 'data:image/jpeg;base64,' + response.data };
                this.setState({
                    imageSource: source,
                    data: response.data,
                });
            }
        });
    } 

这是显示代码

<Image source={this.state.imageSource} style={{ width: 200, height: 250 }} />

不会引发错误。

Answer 1

尝试将图像源直接设置为ImagePicker 响应提供的uri。

Alert.alert(response.uri);
let source = { uri: response.uri };
this.setState({
  imageSource: source,
  data: response.data,
});

Answer 2

在设置状态时尝试添加 console.log。如果状态为空，那么您在更新状态时会出错。如果状态中填充了所选图像的 uri，则尝试重新构建您的应用程序

Answer 3

最后我发现了问题，这是由于 react-native-web-swiper，我的 Image 容器在里面，这不支持重新渲染状态。