将数据附加到 AsyncStorage答案

【问题标题】：Appending data to AsyncStorage将数据附加到 AsyncStorage
【发布时间】：2023-04-03 22:50:02
【问题描述】：

我正在尝试将对象附加到 AsyncStorage 中的现有对象数组，但没有成功。任何帮助表示赞赏！

当前代码：

const [storageItems, setStorageItems] = useState([]);

 const handleHabitCreation = async () => {
        setLoading(true);

        const newHabit = {
            name: name,
            color: updatedColor,
            days: daysCount,
            times: timesCount,
            reminder: selectedDate,
            description: description,
        };

        try {
            const jsonValue = await AsyncStorage.getItem('@habit');
            setStorageItems(jsonValue);
        } catch (error) {
            console.error(error);
        }

        const stringifiedHabit = JSON.stringify(newHabit);
        setStorageItems([...storageItems, stringifiedHabit]);

        try {
            await AsyncStorage.setItem('@habit', JSON.stringify(storageItems));
            setTimeout(() => {
                setLoading(false);
                navigation.pop(3);
            }, 2500);
        } catch (error) {
            console.error(error);
        }
    };

【问题讨论】：

我没有看到你在任何地方使用JSON.parse() 将存储的字符串实际解析为 JS 对象。
它以某种方式抛出一个错误，说无法解析“对象”

标签： javascript reactjs react-native asyncstorage

【解决方案1】：

问题是您没有解析字符串化的 json 数据。您需要对其进行解析以执行任何修改。将状态中的数据保存为已解析的 json，并在将其保存到异步存储之前对其进行 srtingify。试试这个代码：

try {
    const jsonValue = await AsyncStorage.getItem('@habit');

    // saving parsed json
    const data = JSON.parse(jsonValue)
    setStorageItems(data);
} catch (error) {
    console.error(error);
}
// state depends on previous state
setStorageItems((prevState) => [...prevState, newHabit]);

或缩短

try {
    const jsonValue = await AsyncStorage.getItem('@habit');
    let data = JSON.parse(jsonValue) // parse to modify

    // push newHabit as well
    data.push(newHabit)

    setStorageItems(data);
} catch (error) {
    console.error(error);
}

在这两种方法中，最后都将对象字符串化

await AsyncStorage.setItem('@habit', JSON.stringify(storageItems));

【讨论】：