链接等待与。然后尝试捕获语法

Question

我有一个提交功能

const onSubmit = async (creditCardInput) => {
const { navigation } = this.props;
this.setState({ submitted: true });
let creditCardToken;

try {
  creditCardToken = await getCreditCardToken(creditCardInput);
  if (creditCardToken.error) {
    this.setState({ submitted: false});
    return;
  }
} catch (e) {
  this.setState({ submitted: false });
  return;
}


try {
  const obj = await subscribeUser(creditCardToken);
  console.log('returned obj', obj);
  try {
    const docRef = await this.db.collection("users").doc(this.user.email).set({
      id: this.user.uid,
      subscriptionId: obj.customerId,
      active: true
    });
    console.log("Document written with ID: ", docRef);
    this.navigateToScreen('HomeScreen');
  } catch (e) {
    console.log("Error adding document: ", e);
  }
} catch (error) {
  console.log('catch error', error);
  this.setState({ submitted: false, error: SERVER_ERROR, message: error });
}  
};

这是可疑的-当这。db。集合调用失败实现捕获意味着它将注销“添加文档时出错：”，请参阅下面的代码段

  try {
    const docRef = await this.db.collection("users").doc(this.user.email).set({
      id: this.user.uid,
      subscriptionId: obj.customerId,
      active: true
    });
    console.log("Document written with ID: ", docRef);
    this.navigateToScreen('HomeScreen');
  } catch (e) {
    console.log("Error adding document: ", e);
  }

但是，当我以不同的方式实现subscribe user函数时（见下文），我不再使用try-catch，而是使用。然后在wait上，内部函数最终失败，执行外部catch语句，这意味着它将从控制台注销。日志（'catch error'，error）；当它应该注销控制台时。日志（“添加文档时出错：”，错误）；为什么呢？它们不应该以相同的方式工作吗？这意味着上面和下面的代码片段应该以相同的方式工作，请参见下面的代码

await subscribeUser(creditCardToken).then((obj)=> {
this.db.collection("users").doc(this.user.email).set({
    id: this.user.uid,
    subscriptionId: obj.customerId,
    active: true
}).then((docRef) => {
    console.log("Document written with ID: ", docRef);
    this.navigateToScreen('HomeScreen');
}).catch((errors) => {
    console.log("Error adding document: ", errors);
});
}).catch((error) => {
    console.log('catch error', error);
    this.setState({ submitted: false message: error });
});

当this.db.collections成功解析.然后执行它应该意味着它用console.log（用ID写的文档：，docRef）注销的方式时，只是一个附加的注意事项，但是就像我之前说过的，如果它被拒绝，则执行外部捕获而不是内心的渴望

此外，向this.db.collection函数添加返回和删除等待对结果没有影响

Answer 1

有两种方法可以处理此问题-将set函数转换为使用async/await语法，或将set函数返回到subscribeeuser函数的next-then语句。我将两者都展示，但我更喜欢第二个，因为我不喜欢将async/await与then/catch混合使用。

const tempThis = this
subscribeUser(creditCardToken).then((obj)=> {
  // RETURN this promise and you'll get it in the next then statement
  return tempThis.db.collection("users").doc(tempThis.user.email).set({
    id: tempThis.user.uid,
    subscriptionId: obj.customerId,
    active: true
  })
}).then((docRef) => {
  console.log("Document written with ID: ", docRef);
  this.navigateToScreen('HomeScreen');
}).catch((errors) => {
  // This will catch the errors from subscribeUser AND from the set function
  console.log("Error adding document: ", errors);
});

或者只使用异步/等待

try {
  const obj = await subscribeUser(creditCardToken)
  const docRef = await this.db.collection("users").doc(this.user.email).set({
    id: this.user.uid,
    subscriptionId: obj.customerId,
    active: true
  })
  console.log("Document written with ID: ", docRef);
  this.navigateToScreen('HomeScreen');
} catch (error) {
  // Handle your errors
}