如何在reactjs中加載網絡圖像網址？

我一直在試圖加載reactjs外部圖像，使用下面的代碼

模塊未發現：在「/用戶/管理員/ WEBSITE1 /網站/ src目錄」無法解析「https://www.example.com/logo.png」

我的代碼如下：

<div className="profile-userpic"> 
    <img src="https://www.example.com/logo.png" /> 
</div>

，其中在本地存儲負載的成功

<div className="profile-userpic"> 
     <img src={require('./images/me-icon.png')} /> 
    </div>

圖像210

2017-10-04 karan

我會說，這是一個的WebPack /裝載機問題。與直接反應無關，你可以發佈你的'webpack.config.js'文件嗎？ – webdeb

您可能正在使用試圖從組件中提取圖像的預處理器。

如果是這種情況，那麼您可能需要將assets目錄添加到您的配置中。你可以在圖片here上找到webpack的指南，以防你正在使用的工具。

否則，提供更多的上下文。

2017-10-04 11:29:58 jenriquer

-3

您的<img/>實際上並不是一個DOM元素，所以只是給它一個字符串將不起作用。這是一個JSX屬性表達式，因此您需要在實際字符串周圍使用花括號來使其起作用。

類似的問題已經在這裏找到答案： https://stackoverflow.com/a/26065890

2017-10-04 11:34:47 damm123

作爲源的字符串大多數情況下都很好，OP的錯誤表示「無法解析」，這意味着它試圖解析src屬性，這導致了結論，即在兩者之間存在一些加載器。 – webdeb

回答