在 AsyncStorage React Native 上保存对象数组

干得好阿姆鲁拉·菲克里

我正在尝试保存和读取本地存储中的对象数组数据。保存过程已经完成，下面是我的对象结构，以提供更多信息：

有两种类型的类别：收入和结果，因此我在保存条目时使用这些类别作为我的密钥，完整代码如下所示：

const onSubmit = async () => {
    const newData = {
      category: type,
      title: title,
      note: note,
      amount: amount,
      date: date,
    };
    try {
      const jsonData = JSON.stringify(newData);
      let existingTransactions = await getTransaction(newData.category);
      const updatedTransactions = [...existingTransactions, jsonData];
      await AsyncStorage.setItem(
        newData.category,
        JSON.stringify(updatedTransactions)
      );
    } catch (err) {
      console.log(err);
    }
  };

  const getTransaction = async (category) => {
    let transactions = await AsyncStorage.getItem(category);
    if (transactions) {
      return JSON.parse(transactions);
    } else {
      return [];
    }
  };

基本上在保存新对象之前，我需要读取以前保存的数组，然后将新对象推送到现有数组中，最后使用 setItem 将它们全部保存。下面是每当我保存它在控制台上打印的新对象时的对象数组：

我的问题是：

1. 我用 KEY 做正确的事吗？或者我应该让每个对象的密钥都是唯一的？

2. 每当我尝试使用 getItem 读取这些数组然后映射数组时，我无法获得我想要的数据，我只能获得如下所示的完整对象：

但我不能只说每个对象的类别或标题。

这是我用来读取数组的代码：

const [data, setData] = useState([]);
  useEffect(() => {
    async function fetchData() {
      const value = await AsyncStorage.getItem(category);
      const arrayData = JSON.parse(value);
      console.log(arrayData);
      setData(arrayData);
    }
    fetchData();
  }, []);
  
 {data.map((entry, index) => {
   return <Text key={index}>{entry}</Text>;
 })}

瑜伽士

我熟悉 React.js，而不是 React Native。但是，根据我的阅读，您使用JSON.stringify过早犯了错误。

// const onSubmit = async () => {
// ...
    try {
      const jsonData = JSON.stringify(newData); // convert object to string
      let existingTransactions = await getTransaction(newData.category);
      const updatedTransactions = [...existingTransactions, jsonData]; // you're having array of string, not array of object
      await AsyncStorage.setItem(
        newData.category,
        JSON.stringify(updatedTransactions)
      );
    } 
// ...

先去掉JSON.stringify，然后像这样稍微改一下代码

// const onSubmit = async () => {
// ...
    try {
      let existingTransactions = await getTransaction(newData.category);
      const updatedTransactions = [...existingTransactions, newData]; // notice the newData here
      await AsyncStorage.setItem(
        newData.category,
        JSON.stringify(updatedTransactions)
      );
    } 
// ...

请先清除存储，然后您可以重试。德米基安拉。

本文收集自互联网，转载请注明来源。

如有侵权，请联系 [email protected] 删除。