如何在React Native中清除圖片的磁盤緩存

Question

當我使用image.prefetch方法時，我想清理它的磁盤緩存，但是我在React Native中找不到合適的方法。

Answer 1

更新澄清：React Native不公開此方法以執行您現在需要的方法，您將不得不使用第三方解決方案。

因此，您可以使用我的高階組件模塊升級<圖片>來代替使用本機Image.prefetch（）來處理緩存/永久存儲，並完成此操作。

React Native Image Cache HOC

鉈; DR代碼示例：

import imageCacheHoc from 'react-native-image-cache-hoc'; 
const CacheableImage = imageCacheHoc(Image); 

export default class App extends Component<{}> { 
    render() { 
    return (
     <View style={styles.container}> 
     <Text style={styles.welcome}>Welcome to React Native!</Text> 
     <CacheableImage style={styles.image} source={{uri: 'https://i.redd.it/rc29s4bz61uz.png'}} /> 
     <CacheableImage style={styles.image} source={{uri: 'https://i.redd.it/hhhim0kc5swz.jpg'}} permanent={true} /> 
     </View> 
); 
    } 
} 

第一圖像將被緩存，直到總本地緩存增長過去15 MB（默認），則高速緩存的圖像被首先刪除最老直到總緩存再次低於15 MB。

第二張圖像將永久存儲到本地磁盤。人們使用這個替代品來替代您的應用發佈靜態圖片文件。

如果你想預暖緩存樣Image.prefetch（）

import imageCacheHoc from 'react-native-image-cache-hoc'; 
const CacheableImage = imageCacheHoc(Image); 
CacheableImage.cacheFile('https://i.redd.it/hhhim0kc5swz.jpg') 
    .then(localFileInfo => { 
    console.log(localFileInfo); 

    // Console log outputs: 
    //{ 
    // url: 'https://i.redd.it/rc29s4bz61uz.png', 
    // cacheType: 'cache', //add true as 2nd param to cacheFile() to make permanent 
    // localFilePath: '/this/is/absolute/path/to/file.jpg' 
    //} 

    }); 

然後，當你想從磁盤清除它的要求：

import RNFetchBlob from 'react-native-fetch-blob'; 
RNFetchBlob.fs.unlink(localFilePath.localFilePath) 
    .then(() => { 
    console.log('file deleted!'); 
    }); 

希望這可以幫助你！