1

我正在尝试使用 URl 填充图像 

<Image source={{uri: this.state.imageURL}} style={styles.thumb} />

我使用 fetch API 从服务器请求图像，它返回一个 blob。

然后，我使用以下行将 BLOB 转换为 URL： 

var imageURL = window.URL.createObjectURL(attachmentBLOB);

当我 console.log() 它打印的 imageURL 时： 

blob:http%3A//localhost%3A8081/4ce24d92-0b7e-4350-9a18-83b74bed6f87

我没有收到任何错误或警告。图片只是不显示

我正在使用安卓模拟器。

请帮忙。提前致谢！

4

1 回答 1

3

解决方案

React-Native 不支持 blob [参考：Git/React-Native ]。为了让它工作，我必须下载react-native-fetch-blob，它返回一个 base64 字符串。

返回base64字符串的函数： 

var RNFetchBlob = require('react-native-fetch-blob').default;

getImageAttachment: function(uri_attachment, mimetype_attachment) {

  return new Promise((RESOLVE, REJECT) => {

    // Fetch attachment
    RNFetchBlob.fetch('GET', config.apiRoot+'/app/'+uri_attachment)
      .then((response) => {

        let base64Str = response.data;
        var imageBase64 = 'data:'+mimetype_attachment+';base64,'+base64Str;
        // Return base64 image
        RESOLVE(imageBase64)
     })

   }).catch((error) => {
   // error handling
   console.log("Error: ", error)
 });
},

使用 base64 填充图像
然后我使用返回的 base64Image 填充图像： 

<Image source={{uri: imageBase64}} style={styles.image} />
于 2016-08-06T12:34:20.657 回答