类型错误：未定义不是构造函数(评估"新_auth。验证码验证程序')

Question

我正在尝试使用此链接为我的移动应用程序添加firebase身份验证以支持电话号码身份验证。

我代码的最小版本是

import React, { useState } from "react";
import {
Text,
View,
Image,
ImageBackground,
TouchableOpacity,
TextInput
} from "react-native";
import Firebase from '../config/firebase';
import { getAuth, signInWithPhoneNumber, RecaptchaVerifier } from "firebase/auth";
const WelcomeScreen = ({ navigation }) => {
function continueButton() {
return (
<TouchableOpacity
activeOpacity={0.9}
onPress={async () =>   {  
console.log("Inside on press");
window.recaptchaVerifier = new RecaptchaVerifier('sign-in-button', {
'size': 'invisible',
'callback': (response) => {
// reCAPTCHA solved, allow signInWithPhoneNumber.
}
}, auth);
navigation.navigate("Verification", {confirm: confirmation})}}
>
</TouchableOpacity>
);
}
}

当我点击继续按钮时，触发continueButton()函数，从而导致给定的错误

[Unhandled promise rejection: TypeError: undefined is not a constructor (evaluating 'new _auth.RecaptchaVerifier')]
at node_modules/react-native/Libraries/Pressability/Pressability.js:691:17 in _performTransitionSideEffects
at node_modules/react-native/Libraries/Pressability/Pressability.js:628:6 in _receiveSignal
at node_modules/react-native/Libraries/Pressability/Pressability.js:524:8 in responderEventHandlers.onResponderRelease

我一直在试图找出问题的根本原因，但什么也没找到。你能帮我修复这个错误吗?

Answer 1

请尝试一下

const WelcomeScreen = ({ navigation }) => {
function continueButton() {
return (
<TouchableOpacity
activeOpacity={0.9}
onPress={async () =>   {  
console.log("Inside on press");
window.recaptchaVerifier = new RecaptchaVerifier('sign-in-button', {
'size': 'invisible',
'callback': (response) => {
return response; // or return some required value here.
}
}, auth);
navigation.navigate("Verification", {confirm: confirmation})}}
>
</TouchableOpacity>
);
}