React Native圖片緩存解決方案

1. react-native-fetch-blob 將圖片存在本地的一個東西react

 

2. react-native-img-cache 自動緩存的一個東西git

上面裝好後 就可使用啦github

 

import {CachedImage} from "react-native-img-cache";react-native

<CachedImage source={{ uri: "https://i.ytimg.com/vi/yaqe1qesQ8c/maxresdefault.jpg" }} />緩存

 

若是想讓圖片有種加載效果fetch

import Image from 'react-native-image-progress';3d

import ProgressBar from 'react-native-progress/Bar';component

 

最後使用blog

import {CustomCachedImage} from "react-native-img-cache";圖片

 

import Image from 'react-native-image-progress';

import ProgressBar from 'react-native-progress/Bar';

 

<CustomCachedImage

  component={Image}

  source={{ uri: 'http://loremflickr.com/640/480/dog' }} 

  indicator={ProgressBar} 

  style={{

    width: 320, 

    height: 240, 

  }}/>

image-progress-demo

傳送門:https://github.com/wcandillon/react-native-img-cache

相關文章
相關標籤/搜索