隨機圖像鏈接在整個元素列表中呈現相同

Question

我使用的是react-toolbox，我想用隨機圖像渲染項目（ListItem）的列表（List）作爲頭像。我發現這個鏈接http://lorempixel.com/，它可以讓你輕鬆獲得一個隨機圖像。

我的項目看起來像

<ListItem 
    avatar={'http://lorempixel.com/50/50'} 
    caption={name} 
/> 

，每次我創建一個新項目時我有這樣

隨機圖像但如果我刷新頁面，所有的圖像成爲相同

我的所有物品都不一樣，爲什麼圖像一樣？如果再次刷新一次，圖像會發生變化，但所有項目仍然相同。

Answer 1

具有相同的URL最可能的是，瀏覽器將不會再次下載圖像的每一次出現，所以你應該添加一個唯一的標識符：

<ListItem 
    avatar={`http://lorempixel.com/50/50?${Math.random()`} 
    caption={name} 
/> 

Answer 2

Lorempixels每次請求一個圖片時都會返回一個新圖片，但瀏覽器只會解析一次請求，因爲它的URL相同。

嘗試追加一個隨機字符串作爲每個項目的get參數。 檢查這太問題的答案以獲得更多信息Disable cache for some images