ReacNative 文件操作 react-native-fs

阳光穿透心脏的1/2处 2022-12-01 05:23 589阅读 0赞

## 安装包 ##

npm install react-native-fs --save

## Link ##

react-native link react-native-fs

## 简单示例 ##

再assets目录下添加一个文件config.json  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2RhYnVzaWRlZGU_size_16_color_FFFFFF_t_70_pic_center]

**读取文件**  
import RNFS from ‘react-native-fs’;

RNFS.readFileAssets(‘config.json’).then((result) => \{  
let config = JSON.parse(result);  
setBaseUrl(config.baseUrl);  
\})

## 可读写的文件目录 ##

**插件提供了如下可读写目录**

console.log('MainBundlePath=' + RNFS.MainBundlePath)
    console.log('CachesDirectoryPath=' + RNFS.CachesDirectoryPath)
    console.log('DocumentDirectoryPath=' + RNFS.DocumentDirectoryPath)
    console.log('TemporaryDirectoryPath=' + RNFS.TemporaryDirectoryPath)
    console.log('LibraryDirectoryPath=' + RNFS.LibraryDirectoryPath)
    console.log('ExternalDirectoryPath=' + RNFS.ExternalDirectoryPath)
    console.log('ExternalStorageDirectoryPath=' + RNFS.ExternalStorageDirectoryPath)

安卓输出如下

MainBundlePath=undefined
    CachesDirectoryPath=/data/data/com.iceemblem/cache
    DocumentDirectoryPath=/data/data/com.iceemblem/files
    TemporaryDirectoryPath=/data/data/com.iceemblem/cache
    LibraryDirectoryPath=undefined
    ExternalDirectoryPath=/storage/emulated/0/Android/data/com.iceemblem/files
    ExternalStorageDirectoryPath=/storage/emulated/0

## 基本Api ##

**读取目录**

RNFS.readDir(RNFS.MainBundlePath)
        .then((result) => { 
            console.log('GOT RESULT', result);
        })

**文件创建**

RNFS.writeFile(path, 'Lorem ipsum dolor sit amet', 'utf8')
        .then((success) => { 
            console.log('FILE WRITTEN!');
        })

**文件删除**

RNFS.unlink(path)
        .then(() => { 
            console.log('FILE DELETED');
        })

更多Api：https://github.com/itinance/react-native-fs

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2RhYnVzaWRlZGU_size_16_color_FFFFFF_t_70_pic_center]: /images/20221123/2b81e29611144645b4b0dd10e3ed9bdc.png