时间戳

首页 > 解决方案 > 在 React-native 的异步存储中扩展和显示数组

javascript - 在 React-native 的异步存储中扩展和显示数组

问题描述

我正在尝试将用户输入添加到 AsyncStorage 中的特定数组。我不确定我当前的代码是否正在执行此操作。我无法通过“alert()”显示它，目前我收到此错误： the bind value at index 1 is null"

async addAvailableActivity(){
  try {
    AsyncStorage.getItem('availableActivities')
    .then(activities => {this.availableActivities = JSON.parse(activities)})
  } catch (error) {
    alert('Couldnt load activities!')
  }

  let newActivity = this.state.newActivity
  this.availableActivities.push(newActivity)

  try {
    AsyncStorage.setItem('availableActivities', JSON.stringify(this.availableActivities))
  } catch (error) {
    alert('Couldnt add activity!')
  }

}

async displayAvailableActivities(){
  AsyncStorage.getItem(this.availableActivities).then(activities => {alert(activities)})    
}

标签： javascriptjsondatabasereact-nativeasyncstorage

解决方案

您的代码存在一些问题，首先，availableActivities如果您想像这样定义它的范围，我会将其存储在您的组件状态中。其次，当你调用一个函数时，async你应该使用await你的 Promise，第三也是最重要AsyncStorage.getItem(this.availableActivities)的，这似乎是一个错字，但AsyncStorage键值对必须是字符串。

这是对您的代码的更新，我认为它将提供您正在寻找的功能：

addAvailableActivity = async () => {
  try {
    let activities = await AsyncStorage.getItem('availableActivities')
    let { newActivity } = this.state
    if (activities != null) {
      activities = JSON.parse(activities)
      activities.push(newActivity)
      await AsyncStorage.setItem( 'availableActivities', JSON.stringify(activities) )
    }
  } catch (error) {
    console.warn(error)
  }
}

displayAvailableActivities = () => {
  let activities = await AsyncStorage.getItem('availableActivities')
  console.warn(JSON.parse(activities))
}

请注意，我更改了函数声明，这不是必需的，但它可以防止它们必须绑定在您的构造函数中。async / await是一种替代语法，.then它更简洁、更易于阅读。要检查 AsyncStorage 是否返回了一个值，最好对其进行测试null，最后，我修复了您最后一个函数中的错字。如果您有任何问题或我错过了分数，请告诉我

推荐阅读