如何使用 Toast 和 Typescript 向用户正确显示 Firebase Auth 错误？

Question

假设用户想要注册或登录帐户。但是，Firebase 错误显示如下。如何使用带有 typescript 的 try-catch 语句向用户显示 toast 通知？

[FirebaseError: Firebase: Error (auth/email-already-in-use).]

这是我试过的代码：

    try {
      const credential = await signUpWithEmail(data.email, data.password);
      if (credential.uid) {
        toast.show({
          title: 'Account created! ',
          status: 'success',
          description: 'Welcome!.',
        });
      } else {
        const auth = getAuth();
        auth.signOut();
      }
    } catch (err) {
      toast.show({
        title: 'Cannot sign-up an account.',
        status: 'error',
        description: [CONDITIONAL ERROR MESSAGE FOR DISPLAYING TO THE USER],
      });
    }

编辑：添加代码

Answer 1

err 对象有一个 code 属性可以在代码中检查，还有一个 message 属性可以显示给用户。

所以：

  ...
} catch (err) {
  toast.show({
    title: 'Cannot sign-up an account.',
    status: 'error',
    description: err.message,
  });
}

请参阅有关 sending a password reset email 的 Firebase 文档，其中包含访问这两个属性的示例。

另见：

Firebase error messages in different languages?

如何使用 Toast 和 Typescript 向用户正确显示 Firebase Auth 错误？

How to properly display Firebase Auth error to user using Toast and Typescript?

javascript

firebase

reactjs

firebase-authentication