2016-05-17 13 views
4

リモートイメージが失敗した場合にローカルイメージをロードできますか?リモートイメージをロードした後でローカルイメージをロードできない

例えば、私は次のコードを持っています。たとえば場合

<Image style={ styles.userImage } 
     source={ { uri: http://example.com/my_image.jpg } } 
     onError={(error) => ...} 
/> 

を私はonErrorにエラーが発生します、http://example.com/my_image.jpgにアクセスする権利を持っていません。代わりにローカルイメージをロードする方法はありますか?

答えて

7

コンポーネントの状態を使用します。あなたのコンストラクタで初期URLを設定します。

this.state = { image: { uri: 'http://example.com/my_image.jpg' } } 

onErrorハンドラを作成します。その後、

onError(error){ 
    this.setState({ image: require('your_local_image.path')}) 
} 

と一緒にそれをすべてを兼ね備え:

<Image style={ styles.userImage } 
     source={ this.state.image } 
     onError={ this.onError.bind(this) } 
/> 
+0

を、私はそれを試してみたとのonErrorがで呼び出されたことがありませんiOS。私は404エラーでimgリンクを試しました。 – TomSawyer

+0

私たちがthis.state = {image:{uri: 'http://example.com/my_image.jpg'}}の使い方よりも配列からイメージを取得する場合、 –

関連する問題