Источник Img должен быть динамическим

как я могу загрузить динамику img src с помощью React? Я пробовал следующее:

 const country = this.state.countryCode;
 <img src = "https://www.countryflags.io/"+country+"/shiny/64.png"/>

Но я получил ошибку:

Parsing error: Unexpected token

reactjs

28.05.2019 14:44

Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией

В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.

Концепция локализации и ее применение в приложениях React ⚡️

Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...

Навигация по приложениям React: Исчерпывающее руководство по React Router

React Router стала незаменимой библиотекой для создания одностраничных приложений с навигацией в React. В этой статье блога мы подробно рассмотрим...

Массив зависимостей в React

Все о массиве Dependency и его связи с useEffect.

Компонент против элемента в ReactJS - секрет оптимизации производительности за счет повторного использования элементов

Проще говоря, компонент - это фабрика для создания элементов.

Руководство по использованию хука useEffect для методов жизненного цикла React

Перейти к ответу Данный вопрос помечен как решенный

Ответы 2

Это не специфично для React, это потому, что у вас есть + в src.

Используйте строку литерал шаблона с обратными галочками:

src=`https://www.countryflags.io/${country}/shiny/64.png`

28.05.2019 14:47

Ответ принят как подходящий

Вы забыли фигурные скобки. Кроме того, вы можете создать строку URL-адреса раньше и использовать ее:

 const url = "https://www.countryflags.io/"+this.state.countryCode+"/shiny/64.png";
 <img src = {url}/>

28.05.2019 14:48

Другие вопросы по теме

Получение неопределенной ошибки при установке состояния

Как я могу сделать так, чтобы мое внешнее приложение получало доступ к моему серверу узла apis

Как запустить .map(), начиная со второго индекса и далее?

Как визуализировать символ BULLET в React Native?

Должен ли я обновлять состояние редукторов для определенного компонента или управлять состоянием компонента?

Несколько вариантов флажков в ReactJS

Реагировать на проблему распространения события перетаскивания

Как визуализировать дочерние компоненты только в реакции

Как присвоить значения состояниям после открытия формы редактирования?

Как напечатать подстроку в React JSX?

Источник Img должен быть динамическим

Ответы 2

Другие вопросы по теме

Похожие вопросы