react native 清除缓存_react nativenpm run ios 怎么清除缓存-优快云博客

本文介绍了如何在React Native项目中使用react-native-http-cache库来清除缓存。首先通过安装库并链接到项目，然后详细说明了针对Android和iOS平台的配置步骤，包括在Android Studio和Xcode中的手动操作。最后，文章提到了在项目中使用该库的方法，并指出清除缓存后仍有0.15M残留的问题，以及如何解决此问题以达到显示为0M的效果。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1、安装react-native-http-cache

npm install react-native-http-cache --save

2、Linking Libraries

react-native link react-native-http-cache

执行这个命令之后，Android和iOS项目都会把库链接进去。
link 成功.png

(PS: 如果该命令添加失败的话，需要自己在Xcode或者Android Studio 手动添加。)

3、分别配置`Android`平台和`iOS`平台

我也是按照github的文档配置的。

3.1 Android

把项目里面的android目录拖进Android Studio

3.1.1、修改`MainApplication.java`文件

3.1.2、Android 修改 `HttpCacheModule.java`文件

(目录为node_modules>react-native-http-cache>android>src>main>java>cn>reactnative>httpcache>HttpCacheModule.java)

//将69改成：
FileCache cache1 = ImagePipelineFactory.getInstance().getMainFileCache();
/将80行改成：
FileCache cache2 = ImagePipelineFactory.getInstance().getSmallImageFileCache();

如果不修改以上2个方法，会显示如下报错：

3.2、iOS

把项目里面的ios目录拖进Xcode

ios修改.png

4、在react native 项目使用`react-native-http-cache`

import * as CacheManager from 'react-native-http-cache';

我把CacheManager打印了一下，可以看到它有这些方法：

以下方法返回的是一个 promise 对象

方法	说明
CacheManager.clearCache()	清除缓存
CacheManager.clearHttpCache()	清除网络缓存
CacheManager.clearImageCache()	清除图片缓存
CacheManager.getCacheSize()	返回网络缓存大小和图片缓存大小
CacheManager.getImageCacheSize()	获取图片缓存
CacheManager.getHttpCacheSize()	获取网络缓存

    //获取缓存
    getCache(){
        CacheManager.getCacheSize().then(res=>{
            let cacheSize = Math.round((res / 1024 / 1024) * 100) / 100 + 'M';
            this.setState({
                cacheSize
            })
        },err=>{
            console.log(err)
        })
    }
    //清除缓存
    clearCache(){
        CacheManager.clearCache();
        this.setState({
            cacheSize: '0M'
        })
    }

经测试，清楚缓存之后，还是会有0.15M 。为了界面好看点，我在上面的代码中直接设置清除缓存后为0M了。