如何使用 Expo 文件系统保存导入的 JSON 文件

Question

我一直在与 Expo 合作开发一个 React Native 项目，该项目使用 json 文件来存储本地数据。我像这样导入数据 import data from '../database.json'

我正在使用 .json 文件对导入的 JSON 进行更改（添加和删除）data.push(new_data)。当我关闭应用程序时，这些更改不会持久，因为我不知道如何保存它们。我已经研究过使用 expo-file-system 库，如下所示：

import * as FileSystem from 'expo-file-system';
...
FileSystem.writeAsStringAsync(FileSystem.documentDirectory + 'database.json', data);

这是通过查看 API 文档中的示例得出的。然而，这总是会抛出承诺拒绝并且最终不会写入文件。你能为我指出正确的方向吗？

另外，我是否应该以不同的方式导入database.json，以便我已经有了将其保存到的uri？

Answer 1

该文档没有给出承诺中返回的 props 的示例，因此我忽略它的时间比我愿意承认的要长。我真的致力于解决这个问题，以便我可以使用 Expo 解决方案，并且完全错过了createFileAsync 的返回 Promise，所以希望这可以在将来为某人节省大量时间。

import * as FileSystem from 'expo-file-system';
const { StorageAccessFramework } = FileSystem;

const saveFile = async () => {
  const permissions = await StorageAccessFramework.requestDirectoryPermissionsAsync();
  // Check if permission granted
  if (permissions.granted) {
    // Get the directory uri that was approved
    let directoryUri = permissions.directoryUri;
    let data = "Hello World";
    // Create file and pass it's SAF URI
    await StorageAccessFramework.createFileAsync(directoryUri, "filename", "application/json").then(async(fileUri) => {
      // Save data to newly created file
      await FileSystem.writeAsStringAsync(fileUri, data, { encoding: FileSystem.EncodingType.UTF8 });
    })
    .catch((e) => {
      console.log(e);
    });
  } else {
    alert("You must allow permission to save.")
  }
}

Answer 2

请改用 AsyncStorage。React Native 包已弃用但可以使用，或者使用 @react-native-community/async-storage 并将 json 转换为字符串（AsyncStorage 只能存储字符串）

设定项目

import AsyncStorage from '@react-native-community/async-storage';
...
await AsyncStorage.setItem('myData', JSON.stringify(data))

获取物品

const data = await AsyncStorage.getItem('myData'):