Question

当我使用image.prefetch方法时，我想清理其磁盘缓存，但我没有在React Native中找到合适的方法。

Answer 1

更新以澄清：React Native目前没有公开一种方法来开箱即用，你将不得不使用第三方解决方案。

因此，您可以使用我的高阶组件模块升级＆lt; Image＆gt;而不是使用本机Image.prefetch（）。处理缓存/永久存储，并实现这一目标。

Tl; 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!');
  });

希望这能帮到你！

如何在React Native中清除图片的磁盘缓存

1 个答案: