Question

这是我的JSX代码。

<div class="propertie-item set-bg" style="background-image: url('https://s3.us-east-2.amazonaws.com/housessoldeasily.com/img/bg.jpg');"><div class="sale-notic">FOR SALE</div><div class="propertie-info text-white"><div class="info-warp"><h5>176 Kingsberry, Dr Anderson</h5><p><i class="fa fa-map-marker"></i> Rochester, NY 14626</p></div><div class="price">$1,777,000</div></div></div>

但是，当我运行我的应用程序时，未加载图像。当我检查元素时，该元素显示：

<div class="propertie-item set-bg" style="background-image: url('undefined');"><div class="sale-notic">FOR SALE</div><div class="propertie-info text-white"><div class="info-warp"><h5>176 Kingsberry, Dr Anderson</h5><p><i class="fa fa-map-marker"></i> Rochester, NY 14626</p></div><div class="price">$1,777,000</div></div></div>

不知道为什么要这样做，因为它是一个确切的路径并且存在。

Answer 1

据我所见，在其他引号内调用引号会使它们转义。因此，我将图像链接包装在''而不是""中，这样它将正确地在内部显示字符串。

<div class="propertie-item set-bg" style="background-image: url('https://s3.us-east-2.amazonaws.com/housessoldeasily.com/img/bg.jpg');"><div class="sale-notic">FOR SALE</div><div class="propertie-info text-white"><div class="info-warp"><h5>176 Kingsberry, Dr Anderson</h5><p><i class="fa fa-map-marker"></i> Rochester, NY 14626</p></div><div class="price">$1,777,000</div></div></div>

如果您希望将现有的静态站点转换为ReactJS站点，那么我建议阅读此Thinking in React

我的React应用程序将图像的URL渲染为url（'undefined'）;

1 个答案: