組件無法捕獲作為道具傳遞的函數中的錯誤

Question

我有一個Form組件，當單擊Submit按鈕時，它調用：

//Form.js
    //...
    const submit = () => {
            try {
                onSubmit(values); //onSubmit from props, values from state
            } catch (error) {
                console.log(error);
                setSubmitError(error);
            }
    }
    //...

我正在嘗試通過以下方式與onSubmit一起使用它：

export const signIn = ({ email, password }) => (
    auth()
    .signInWithEmailAndPassword(email, password)
    .catch(e => { throw e })
);

但是它無法處理。 在當前版本中，它向控制台拋出錯誤： auth.esm.js:429 Uncaught The email address is badly formatted. 我嘗試用new Error包裝new Error ，但隨后將其拋出到窗口中。 我究竟做錯了什么？

Answer 1

正常的try / catch塊無法捕獲異步錯誤。 但是，您可以聲明一個異步塊，這應該可以工作：

const submit = async () => {
            try {
                await onSubmit(values); //onSubmit from props, values from state
            } catch (error) {
                console.log(error);
                setSubmitError(error);
            }
    }