React Native：返回函数中 AsyncStorage.getItem() 获取的值答案

【问题标题】：React Native: return the value fetched by AsyncStorage.getItem() in functionReact Native：返回函数中 AsyncStorage.getItem() 获取的值
【发布时间】：2016-10-13 18:41:40
【问题描述】：

我有一个有效的 OrderHistory 模型：

import { AsyncStorage } from 'react-native';

const tokenKey = "orderHistory";

export default class OrderHistory extends Object {
  static ordersPlaced() {
    return AsyncStorage.getItem(tokenKey);
  }
}

在我的组件中我有这个：

  showConfirmOrderModal() {
    alert("booya");
  }

  onBuyButtonPress() {
    OrderHistory.ordersPlaced().then((amount) => {
      switch(amount) {
        case null:
          this.showConfirmOrderModal();
          break;
        default:
          this.addToCart(this.state.currentOrder);
      }
    });
  }

有没有办法移动.then 函数来解决OrderHistory 模型中AsyncStorage.getItem() 返回的Promise？我尝试了类似的方法，但没有成功：

订单历史：

export default class OrderHistory extends Object {
  static async ordersPlaced() {
    AsyncStorage.setItem("myKey", "My value here");
    return AsyncStorage.getItem("myKey").then((value) => value);
  }
}

组件：

  onBuyButtonPress() {
    let blah = OrderHistory.ordersPlaced();
    console.log(blah);
  }

但是打印出来的是Promise {_45: 0, _81: 0, _65: null, _54: null}

我做错了什么？

【问题讨论】：

它仍然是异步代码，你必须处理一个 Promise 并使用 .then 来获得结果。你可以看看即将推出的 async/await JS 特性，如果你想让代码看起来同步，here is a QA about it in react-native

标签： react-native

【解决方案1】：

AsyncStorage 方法返回您需要处理的Promise。为了使它更好并摆脱 .then 回调地狱，您可以使用 async/await 语法，它仍然需要 Promise 并“等待”它的完成：

static async ordersPlaced() {
  await AsyncStorage.setItem("myKey", "My value here");
  const value = await AsyncStorage.getItem("myKey");
  //check your value, process it, etc.
  return value;
}

【讨论】：