我试图在我的react native项目中使用firebase身份验证。但它显示错误-
ERROR ReferenceError: Property 'auth' doesn't exist, js engine: hermes
字符串
当我们在注册屏幕中点击注册按钮时,它应该注册一个用户,但它显示错误。SignupScreen.js文件是这样的-
import { View, Text, StyleSheet, Image, TouchableOpacity, TextInput, KeyboardAvoidingView } from 'react-native'
import React, { useState } from 'react'
export default function SignupScreen({navigation}) {
const [email,setEmail]=useState('')
const [password,setPassword]=useState('')
const handleSignUp=()=>{
auth
.createUserWithEmailAndPassword(email,password)
.then(userCredentials=>{
const user =userCredentials.user;
console.log(user.email)
})
.catch(error=>
alert(error.message)
)
}
return (
<KeyboardAvoidingView style={styles.container} behavior='padding'>
<Text style={styles.text}>Create An Account</Text>
<Image source={require('../assets/signup.png')} style={styles.img}/>
<Text style={styles.label}>Name</Text>
<TextInput placeholder='Enter Your Name'
style={styles.input}
/>
<Text style={styles.label}>Email</Text>
<TextInput placeholder='Enter Your Email'
style={styles.input}
value={email}
onChangeText={value=> setEmail(value)}/>
<Text style={styles.label}>Username</Text>
<TextInput placeholder='Enter a Unique username'
style={styles.input}
/>
<Text style={styles.label}>Password</Text>
<TextInput placeholder='Create Password'
style={styles.input}
value={password}
secureTextEntry
onChangeText={value=> setPassword(value)}/>
<TouchableOpacity style={styles.btn} onPress={handleSignUp}>
<Text style={styles.btnText}>Sign Up</Text>
</TouchableOpacity>
<View style={styles.btn2}>
<Text style={{color:"white"}}>Already a User?</Text>
<TouchableOpacity onPress={()=>navigation.navigate("LoginScreen")}>
<Text style={styles.logText}>Log In</Text>
</TouchableOpacity>
</View>
</KeyboardAvoidingView>
)
}
const styles=StyleSheet.create({
container:{
backgroundColor:"#8FA6CB",
flex:1,
padding:30,
justifyContent:"center",
},
text:{
fontSize:30,
color:"white",
fontFamily:"serif",
fontWeight:"bold",
textAlign:"center"
},
img:{
width:340,
height:250,
alignSelf:"center"
},
btn:{
backgroundColor:"#AF2664",
paddingHorizontal:20,
paddingVertical:10,
width:"100%",
borderRadius:8,
marginTop:25
},
btnText:{
color:"white",
alignSelf:"center",
fontSize:18,
},
btn2:{
flexDirection:"row",
gap:10,
alignSelf:"center",
marginTop:10
},
logText:{
color:"#AF2664"
},
input:{
borderWidth:1,
borderRadius:8,
width:"100%",
paddingVertical:10,
paddingHorizontal:15,
fontSize:17,
color:"white",
borderColor:"white",
marginBottom:10
},
label:{
color:"white",
fontSize:19,
marginBottom:5
}
})
型
firebase.js文件-
import *as firebase from "firebase/app";
const firebaseConfig = {
apiKey: "AIzaSyAbKgCge94KVTyv7SMyIx3kAu1BkJXBn5I",
authDomain: "fir-auth-d2499.firebaseapp.com",
projectId: "fir-auth-d2499",
storageBucket: "fir-auth-d2499.appspot.com",
messagingSenderId: "580829064333",
appId: "1:580829064333:web:10f3dbd97070935f5806c4",
measurementId: "G-0WLRSQLJKX"
};
// Initialize Firebase
let app;
if(firebase.apps.length === 0){
app=firebase.initializeApp(firebaseConfig);
}else{
app=firebase.app();
}
const auth=firebase.auth();
export {auth};
型
我不知道为什么它是给错误.我尝试它第一次通过以下youtube视频,我已经按照所有的步骤,但它仍然是显示错误.
3条答案
按热度按时间q9yhzks01#
如果这是你完整的SignupScreen.js文件,那么你在哪里导入你在firebase.js中定义的auth?
第一个月
从firebase.js导入auth,这应该可以解决你的问题,并确保文件路径是准确的。
hts6caw32#
像这样编辑您的
firebase.js
字符串
jm81lzqq3#
您问题中的这段代码使用了Firebase Authentication命名空间SDK:
字符串
但是您并没有在任何地方导入这个SDK,也没有初始化或导入
auth
变量。解决这个问题的最简单方法是导入最新SDK的compat库:
型
然后在使用
auth
之前初始化它:型
有关此方面的更多信息,并防止遇到类似的问题,我建议花点时间阅读Firebase文档,了解如何在Web应用程序中开始使用Firebase身份验证。