2017-07-29 105 views
2

我想了解如何緩存圖片url,以便它不需要重新下載。 我已經採取一看:https://docs.expo.io/versions/v19.0.0/guides/preloading-and-caching-assets.html 並一直在使用Image.prefetch像這樣:Image.prefetch不會自動從緩存中加載[React-Native/Expo]

const prefetchedImages = images.map(url => { 
    console.log('url', url) //this is correctly logging the url 
    return Image.prefetch(url) 
}); 

Promise.all(prefetchedImages) 
    .then(() => { 
     this.setState({loaded:true}) 
}) 

這最終並設置狀態爲真。然後,我在不同的組件中呈現圖像,但是我確保預取的組件不會卸載。我加載URL像這樣:

<Image source={{uri: myImageUrl}} style={{width:100, height:100}} /> 

當我載入圖片到我的網格視圖中,只有本地的圖像立即顯示,並與URL中的有白了一會兒渲染之前。在iOS上使用緩存:'force-cache'時,圖像實際上是從緩存中加載的,並且沒有延遲。如果我使用預取,我認爲我不需要那樣做。

我在這裏錯過了什麼嗎?我以爲我可以像往常一樣調用我的圖像源,系統會知道如何抓取該網址的緩存圖像。

+0

你可以嘗試實現這個解決方案https://medium.com/one-more-thing-studio/caching-your-images-on-react-native-with-expo-7bff361dbd54 – Jeremie

+0

你不能依靠預取在大多數情況下。我在https://medium.com/@wcandillon/5-things-to-know-about-images-react-native-69be41d2a9ee上撰寫了關於該主題的中型故事 – wcandillon

回答