Мой код

import React, { Component } from 'react'; import './App.css'; class App extends Component { state = { loaded: false, error: false } onImageLoad = () ={amp}gt; { this.setState({ loaded: true }) } onImageError = () ={amp}gt; { this.setState({ error: true }); } render() { // let imgSrc = (!error) ? src: fallbackSrc return ( {amp}lt;div{amp}gt; {amp}lt;img src= {'https://unsplash.com/photos/wQLAGv4_OYs'} alt={'Wresting Character'} onLoad={() ={amp}gt; this.onImageLoad()} onError={require('../src/images/batista.jpg')} /{amp}gt; {amp}lt;/div{amp}gt; ) } } export default App; 

Я хочу показать запасное изображение, если URL не работает. Прямо сейчас изображение по умолчанию показывает, но если я изменяю его URL, страница выдает ошибку. Как я могу показать пустышку, если моя ссылка не работает?

Вы можете вернуться к изображению по умолчанию при возникновении ошибки:

 onImageError = (ev) ={amp}gt; { this.setState({ error: true }); ev.target.src = 'some default image url'; } 

Я бы предпочел использовать атрибут onerror в теге img . Вы можете определить обработчик для ошибки и заменить целевой атрибут источника на ваш запасной URL.