#reactjs
#reactjs
Вопрос:
В крошечном тестовом приложении мои переменные внутри кавычек (img, url) не работают. Если я помещаю их внутри элемента h1 или где-либо еще, он отображает правильный контент.
render() {
return (
<div className="row">
{this.state.pages.map((page, index) => {
return (
<div
key={index}
className="page-listing-element col-lg-3 col-md-6 col-sm-12 p-2 box-shadow overflow-hidden"
>
<div>
<h1>
{page.url} - {page.image}
</h1>
<a href="{page.url}" rel="nofollow">
<img src="{page.image}" />
</a>
<h3>
<a href="{page.url}">{page.name}</a>
</h3>
</div>
</div>
);
})}
</div>
);
}
В моем браузере :
<div>
<h1>
/fr/see-do/patrimoine-culture/ -
http://localhost:8001/static/img/main/no_image.jpg
</h1>
<a href="{page.url}" rel="nofollow">
<img src="{page.image}" />
</a>
<h3>
<a href="{page.url}">Patrimoine et culture</a>
</h3>
</div>
Ответ №1:
Вы используете их, strings
добавляя их quotes
. Вам просто нужно убрать кавычки, и все готово.
<a href={page.url} rel="nofollow">
<img src={page.image} />
</a>