image - react native : Images are not getting rendered

Question

在 React Native 中，我只是加载网络图像。

代码:

 const { width, height } = Dimensions.get('window');
 const prod= [];
    const prodName = '';
    const url = '';
    const results = [];
    class Product extends Component {
        renderWhenAPISuccess(){
          results=this.props.product;
          for(var i =1; i<results.length; i++){
            prodName = results[i].prodName;
            url = results[i].url;
            prod.push(
              <View key={i}>
               <Image
                  style={{ width: width/2, height: width/2}}
                  resizeMode={'contain'}
                  /*source={require('../img/bangalore1.jpg')}*/
                  source={{ uri: "https://example.in" + url }}
               ></Image>
               <Text>{prodName}</Text>
              </View>
           )
         }
       }

    render(){
      if(//network success){
        this.renderWhenAPISuccess();
      }
     return (
         {
            !isNetworkSuccess && 
             <View>
                <Text>Wait for api success</Text>
             </View>
         }
         {
          isNetworkSuccess &&
            <View>
              <ScrollView removeClippedSubviews={true}>
                  {prod}
              </ScrollView>
            </View>
         }
        );
     }
    }

当我在屏幕上显示多个图像时，这些图像不会被渲染。

当图像源是这样的:

source={require('../img/bangalore1.jpg')}

其渲染正确。如何正确渲染图像？有没有渲染网络图像的库？

请忽略调用api并存储的部分。除了少数图像的渲染之外，一切工作正常。请注意，随机图像不会渲染。

Answer 1

终于找到解决办法了。

Use react-native-cached-image for fetching mutiple images.

<CachedImage
     style={{ width: width / 2.35, height: 180, }}
     source={{
     uri: "https://myproject.in" + productDetail.image_url
    }}
></CachedImage>