イメージのデフォルトソース？

Question

イメージソースの有効なURIを取得していますが、メディアファイルからイメージを削除すると、Noneファイルが返されます。

通常、画像の無効なURIをチェックしますが、今回はサーバの画像ディレクトリが画像をレンダリングできませんでした。

if(!_.isNil(item.img)) { // This checks if uri is null or string 

私はdefaultSourceを試しましたが、動作しません。それは、以前の有効なURIからImageが存在しない場合、我々は、デフォルトの画像を配置することができますどのように

<Image 
     fadeDuration={0} 
     key={item.id} 
     source={{uri: item.img}} 
     style={styles.rowImage} 
     resizeMode="cover" 
     defaultSource={require('../../assets/images/styles.png')} 
     /> 

永遠に白い画面を示して？あなたのURIが存在しない場合は、処理するためにonErrorを使用することができます

おかげ

Answer 1

。その後、setNativePropsを使ってイメージをあなたのイメージに置き換えてください。

例

ローカルパスを使用する：

import resolveAssetSource from 'resolveAssetSource'; 

... 

handleErr(item){ 

    var imgsrc = require('imagePathHere'); 

    this.refs[`testimage-${item}`].setNativeProps({ 
     src: [resolveAssetSource(imgsrc)] //use source for ios instead of src 
    }); 

} 

... 

<Image 
     //ref="testimage" 
     ref={`testimage-${item.id}`} 
     fadeDuration={0} 
     key={item.id} 
     source={{uri: item.img}} 
     style={styles.rowImage} 
     resizeMode="cover" 
     defaultSource={require('../../assets/images/styles.png')} 
     onError={() => this.handleErr(item.id)} 
     /> 

またはURLから使用してください。

handleErr(item){ 

    var imgsrc = 'http://blahblah.com/tes.jpg'; 

    this.refs[`testimage-${item}`].setNativeProps({ 
     src: [{uri: imgsrc}] //use source for ios instead of src 
    }); 

} 

... 

<Image 
     //ref="testimage" 
     ref={`testimage-${item.id}`} 
     fadeDuration={0} 
     key={item.id} 
     source={{uri: item.img}} 
     style={styles.rowImage} 
     resizeMode="cover" 
     defaultSource={require('../../assets/images/styles.png')} 
     onError={() => this.handleErr(item.id)} 
     />