警告：可能未处理的承诺被拒绝

Question

当我第一次打开新构建的应用程序时，出现以下警告。我认为这是因为AsyncStorage.getItem("KEY")中的键在应用首次运行时没有任何价值。我该如何处理此诺言拒绝？

this.state = {
      subjects: [],
      text: "",
      present_count: [0, 0, 0, 0, 0, 0, 0],
      total_count: [0, 0, 0, 0, 0, 0, 0],
      present: 0,
      total: 0
}

componentDidMount() {
    this._isMounted = true;
    Subjects.all(subjects => this.setState({ subjects: subjects || [] }));
    AsyncStorage.getItem("PRESENT_COUNT").then((value) => {
      this.setState({ present_count: JSON.parse(value || this.state.present_count) });
    });
    AsyncStorage.getItem("TOTAL_COUNT").then((value) => {
      this.setState({ total_count: JSON.parse(value || this.state.total_count) });
    });
    AsyncStorage.getItem("PRESENT").then((value) => {
      this.setState({ present: JSON.parse(value || this.state.present) });
    });
    AsyncStorage.getItem("TOTAL").then((value) => {
      this.setState({ total: JSON.parse(value || this.state.total) });
    });
  }

Answer 1

您可以在.then内使用if块

AsyncStorage.getItem("KEY").then((value) => {
          if(value){
          this.setState({ present_count: JSON.parse(value || this.state.present_count) });
        }
        });

Answer 2

似乎AsyncStorage.getItem是异步操作。在这种情况下，await操作必须完成getItem。您可以使用Promise.all等待getItem方法完成，然后再更新状态。

async componentDidMount() {
  const getPresentCount = AsyncStorage.getItem('PRESENT_COUNT');
  const getTotalCount = AsyncStorage.getItem('TOTAL_COUNT');
  const getPresent = AsyncStorage.getItem('PRESENT');
  const getTotal = AsyncStorage.getItem('TOTAL');

  const [presentCount, totalCount, present, total] = await Promise.all([getPresentCount, getTotalCount, getPresent, getTotal]);
  this.setState({
    present_count: JSON.parse(value) || this.state.present_count,
    total_count: JSON.parse(value) || this.state.total_count,
    present: JSON.parse(value) || this.state.present,
    total: JSON.parse(value) || this.state.total,
  })
}

Answer 3

一种方法是检查value是否很好。

AsyncStorage.getItem("PRESENT_COUNT")
  .then((value) => {
    this.setState({
      present_count: value ? JSON.parse(value) : this.state.present_count
    });
  })

另一种方法是使用捕获块

AsyncStorage.getItem("PRESENT_COUNT")
  .then((value) => {
    this.setState({
      present_count: JSON.parse(value || this.state.present_count),
    });
  })
  .catch((err) => {
    console.log(err);
    this.setState({ someState: "someVal" }); // if required...
  });

最后，您也可以考虑使用另一个答案中提到的promise.all（@wentjun）。请注意，如果您的api调用中的任何一个失败，您最终将无法设置任何状态。使用async / await时，还请确保使用try catch。