如何使用异步存储来保存我的数据? - 反应本机

时间:2021-02-03 01:17:21

标签: javascript node.js react-native asyncstorage

我刚开始使用异步,更不用说异步存储了。我真的不知道我在做什么我的目标是基本上使用 setWorkouts() 将锻炼设置为我从 asyncstorage 获得的值,并使用它来保存设置的锻炼。

简短问题:如何使用异步存储保存我的数据?

代码:

const submitHandler = async (text, reps, sets) => {
    if(text.length > 0 && reps.length > 0 && sets.length > 0){
      if(text.length <= 40){
        let newWorkout = {
          name: text,
          key: Math.random().toString(),
          reps: reps,
          sets: sets
        };
        writeData = async () => {
          try {
            await AsyncStorage.multiSet(['workouts', [
              newWorkout,
              ...workouts
            ]])
          } catch (err) {
            console.log(err)
          }
        }
        await Promise.all(AsyncStorage.getItem('workouts')).then((data) => {
          console.log(data[0])
        })
      }else {Alert.alert('Whoops!', "You entered over 40 characters! Shorten it up a bit!", [{text: 'Close '}])}
    }else {Alert.alert('Whoops!', "Make sure to enter something in each field!", [{text: 'Close '}])}
  }

任何帮助都是有用的!

1 个答案:

答案 0 :(得分:0)

要使用任何方法将数据存储在异步存储中,我们必须解析字符串中的数据,而不是在异步存储函数中传递对象,我们可以使用 JSON.stringify 将对象转换为字符串。

所以,我们可以试试下面的代码示例:

const writeData = async (newWorkout) => {
   try {
       await AsyncStorage.multiSet(['workouts', JSON.stringify([
           newWorkout,
           ...workouts
       ]]))
   } catch (err) {
       console.log(err)
   }
}

const submitHandler = async (text, reps, sets) => {
    if(text.length > 0 && reps.length > 0 && sets.length > 0){
      if(text.length <= 40){
        let newWorkout = {
          name: text,
          key: Math.random().toString(),
          reps: reps,
          sets: sets
        };
        await writeData(newWorkout)
        await AsyncStorage.getItem('workouts').then((data) => {
            console.log(data)
        })
      } else {
          Alert.alert('Whoops!', "You entered over 40 characters! Shorten it up a bit!", [{text: 'Close '}])
      }
   } else {
       Alert.alert('Whoops!', "Make sure to enter something in each field!", [{text: 'Close '}])}
    } 
}

有关使用异步存储设置值和从异步存储获取值的更多详细信息,请查看官方异步存储文档。

https://react-native-async-storage.github.io/async-storage/docs/api/