Функция для чтения изображения — reactjs

#javascript #reactjs

#javascript #reactjs

Вопрос:

Приведенный ниже код считывает изображение независимо от расширения. Но как я могу удалить эти изображения в красном круге?

 ...
                  const imageFileExtentions = ['svg', 'jpeg', 'png']

                  <div>
                    {imageFileExtentions.map(imageFileExtentions => (
                      <CardMedia
                        className={classes.cardMedia}
                        image={`/items/${item.ID}.${imageFileExtentions}`}
                        style={{
                          width: '50%',
                          height: '50%',
                          paddingTop: '20%'
                        }}
                        component="img"
                      />
                    ))}
                  </div>
...
  

введите описание изображения здесь

Комментарии:

1. Подойдет обычный JavaScirpt onerror="this.remove()" Лично я бы определил, что это такое, прежде чем отображать его.

2. как я могу вставить это?

3. Почему ваш внутренний цикл вызывает это imageFileExtensions ? Кроме того, откройте свои инструменты разработки и посмотрите, какой фактический URL-адрес вы заставляете искать браузер. Если это значение 404, на вкладке консоль и сеть будет указано, что вы здесь делаете неправильно.

Ответ №1:

               <CardMedia
                className={classes.cardMedia}
                image={`/ciasbrazil/${cia.CD_CVM}.${imageFileExtentions}`}
                style={{
                  width: '50%',
                  height: '50%',
                  paddingTop: '20%'
                }}
                component="img"
                onError={e => {
                  e.target.onerror = null
                  e.target.style.display = 'none'
                }}
              />