反应原生图像 | setNativeprops 无法更改来源

Question

我已经为网络图像实现了图像 onError 方法，并且错误地尝试使用默认图像更新视图但源属性无效

onLoadError=(event)=>{
     alert('Img load error');
     this.imgPayIcn.setNativeProps({
       source :{uri:'https://facebook.github.io/react/img/logo_og.png'} //not able to update view with new image... no effect


     });

渲染方法

<Image ref={(ref) => this.imgPayIcn = ref} source={this.props.source} style={{height:50,width:50}} resizeMode='cover' onError={this.onLoadError}/>

Answer 1

将您的图像包装在处理错误的组件中：

class ImageWithFallback extends Component {
  state = {
    failed: false,
  }

  render() {
    if (this.state.failed) {
      return <Image source={require('imageFallback.png')} />
    }
    return <Image {...this.props} onError={() => this.setState({ failed: true })} />
  }
}