【问题标题】:How can I use Async Storage to save my data? - React Native如何使用异步存储来保存我的数据? - 反应原生
【发布时间】:2021-02-03 01:17:21
【问题描述】:

我是使用异步的新手,更不用说异步存储了。我真的不知道我在做什么我的目标是基本上使用 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 '}])}
  }

任何帮助都是有用的!

【问题讨论】:

    标签: javascript node.js react-native asyncstorage


    【解决方案1】:

    要使用任何方法将数据存储在异步存储中,我们必须解析字符串中的数据,而不是在异步存储函数中传递对象,我们可以使用 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/

    【讨论】:

    • 嘿,很抱歉通知您,但代码似乎不起作用!它一直在记录未定义,我是否以某种方式使用错误?带来不便敬请谅解。这是代码。 await Promise.all(AsyncStorage.getItem('workouts')).then((data) => { console.log(data[0]) })
    • 我观察到的答案不匹配,请检查一下...尝试用数据替换 data[0]
    • @Hex 还将 writeData 方法保留在 submitHandler 之外,以先存储数据,然后从异步存储中检索。
    猜你喜欢
    • 2020-07-09
    • 2020-12-03
    • 2021-12-07
    • 1970-01-01
    • 2021-12-08
    • 2018-12-31
    • 2019-11-05
    • 1970-01-01
    • 2020-11-23
    相关资源
    最近更新 更多