微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

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

如何解决从react-native-image-picker中选择图像后,图像不会显示

我正在开发一个应用程序,在该应用程序中,我需要从手机上传图像,一旦显示单击“上载图库”,我便可以选择该图像,但是一旦选择了图像,该图像就不会显示在图像容器中用过。

我的代码

这是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 }} />

没有引发错误

解决方法

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

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

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

,

最后我发现了问题,这是由于react-native-web-swiper引起的,我在其中包含了Image容器,这不支持状态的重新呈现。

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。