В JSX, как вы ссылаетесь на значение props
изнутри значения атрибута в кавычках?
Например:
<img className="image" src="images/{this.props.image}" />
В результате получается HTML-вывод:
<img class="image" src="images/{this.props.image}">
javascript
reactjs
react-props
Кантера
источник
источник
Если вы хотите использовать литералы шаблона es6, вам также понадобятся фигурные скобки:
источник
Если вы используете JSX с Harmony, вы можете сделать это:
Здесь вы пишете значение
src
в качестве выражения.источник
Вместо добавления переменных и строк вы можете использовать строки шаблона ES6! Вот пример:
Как и для всех других компонентов JavaScript внутри JSX, используйте строки шаблона внутри фигурных скобок. Чтобы «ввести» переменную, используйте знак доллара, а затем фигурные скобки, содержащие переменную, которую вы хотите ввести. Например:
источник
Для этого рекомендуется добавить метод получения:
Затем, если позже у вас будет больше логики, вы сможете плавно поддерживать код.
источник
Для людей, ищущих ответы относительно функции «карта» и динамических данных, вот рабочий пример.
Это дает URL как « http://examole.com/randomview/images/2/dp_pics/182328.jpg » (случайный пример)
источник
Примечание: в реакции вы можете поместить выражение javascript в фигурную скобку. Мы можем использовать это свойство в этом примере.
Примечание: взгляните на приведенный ниже пример:
источник
Вот лучший вариант для Dynamic className или Props, просто сделайте конкатенацию, как мы делаем в Javascript.
источник
classnames
пакет для создания динамических classNamesты можешь использовать
или
или
источник