2016-09-25 59 views
0

来自网络的图像不会始终加载,有时可以加载,有时不会加载。以下是我的渲染方法。图像不会始终加载来自网络的原始图像组件

render() { 
let {title, image, text, publisher, id, date} = this.props.webDetail; 
let dateString = Moment(date).format('dddd, MMMM Do YYYY'); 
let metaDetail = `${publisher}\n${dateString}`; 

    return (
     <View style={styles.container}> 
      <ScrollView showsVerticalScrollIndicator={false}> 
       <Text style={styles.title}>{title}</Text> 
       <Text style={styles.publisher}>{metaDetail}</Text> 
       <Image 
       style={styles.image} 
       source={{ uri: image }} indicator={Progress} 
       /> 
       <Text style={styles.text}>{text}</Text> 
       {this.renderButton.call(this) } 
     </ScrollView> 
     </View> 
    ); 
} 

图像在feed对象中传递。当父母的触摸事件被调用时,feed对象作为子项道具传递。

renderContent(feed) { 
    let dateString = Moment(feed.date).format('dddd, MMMM Do YYYY'); 
    let metaDetail = `${feed.publisher}\n${dateString}`; 

    return (
     <ScrollView showsVerticalScrollIndicator={false}> 
      <Text style={styles.title}>{feed.title}</Text> 
      <Text style={styles.publisher}>{metaDetail}</Text> 
      <TouchableWithoutFeedback 
       onPress={this.onPress.bind(this, feed) }> 
       <Image style={styles.image} key={feed.image} source={{ uri: `${feed.image}?version=outside` }} indicator={Progress} /> 
      </TouchableWithoutFeedback> 
      <Text numberOfLines={7} style={styles.text}>{feed.description}</Text> 
      <Share rank={feed.rank}/> 
     </ScrollView> 

    ); 
} 
+0

共享代码是用来设置webDetail –

+0

webDetail好,我总是得到有效的图片网址,唯一的一点是它呈现的图像某些时候,有时它不会 – Moniv

+0

您确定图像url总是在渲染过程开始之前拍摄的。 –

回答

0

可能是一个壁画缓存的问题,试图通过增加一个随机数到图像URL使每一次的专属网址:imageUrl + ?"+new Date().getTime()

没有与壁画和图像的各种问题,像这样的一个例子: https://github.com/facebook/react-native/issues/8677

+0

让我试试这个解决方案 – Moniv