Как подключить данные внутри строки URL в React?

Question

Я пытаюсь передать некоторые данные из моего состояния в этот URL-адрес img sr c, и я не могу понять, как их написать. Я пытался использовать обратные тики и знак доллара. Я предполагаю, потому что я нахожусь в части рендеринга компонента, которая не будет работать. Помоги мне, Оби-Ван, ты моя единственная надежда.

<img src={'https://openweathermap.org/img/w/{data.weather.icon}.png'} alt='weather condition' />

Answer 1

вы можете использовать Шаблон Literal

<img src={`https://openweathermap.org/img/w/${data.weather.icon}.png`} alt='weather condition' />

Answer 2

Так же, как с ванилью JS, вы должны использовать Template Literal и использовать интерполяцию строки, чтобы поместить ваш JS в строку (с ${...}) следующим образом:

<img src={`https://openweathermap.org/img/w/${data.weather.icon}.png`} alt='weather condition' />