reactjs渲染圖像動態

要明確：reactjs渲染圖像動態

<img src={require('../styles/myimage.jpg')} />

工作正常。但我想從api中以字符串的形式動態獲取此路徑。在我父組件我把它拿來和傳遞給子女：

<img src={require(this.props.image)} />

在這種情況下this.props.image相同「../styles/myimage.jpg」。但它並沒有爲我工作，並拋出這個錯誤「未捕獲（在承諾）錯誤：無法找到模塊」。」

我該如何解決

的目錄樹（我想取MYIMAGE？從image.js .JPG）enter image description here：而配置的WebPack：enter image description here

來源

2017-07-18 DarKsi

確保道具都值當你的渲染被稱爲 –

@ShubhamKhatri我甚至嘗試有條件的渲染，所以我用fetch ... setState（{image：data，loadImage：true}）發出請求，然後在我的子組件中檢查loadImage是否爲true，然後渲染「this.props.loadImage？：null「。 – DarKsi

除了評論，你可以做的是在你的渲染方法試試這個：

if (!this.props.image) return false;

來源

2017-07-18 10:06:19 kikiwie

做一個簡單的測試，移動樣式路徑與包含你的JPG文件到您的組件相同的路徑，並嘗試在道具路徑：

props.image = './styles/myimage.jpg'

然後

<img src={require(this.props.image)} />

來源

2017-07-18 11:48:20

reactjs渲染圖像動態

回答

相關問題