I am the beginner of react native. I have a problem but i don't understand what i am doing wrong.
This is my code:
import React, {Component} from 'react';
import {
SafeAreaView,
StyleSheet,
ScrollView,
View,
Text,
StatusBar,
} from 'react-native';
import {Button,Input} from 'react-native-elements';
import firebase from './screens/firebase';
console.log(firebase.name);
console.log(firebase.database());
class App extends React.Component
{
constructor(props)
{
super(props);
this.state = ({
name:'',
email : '',
Password : '',
id:'',
phone:'',
})
}
signup = (name,email,Password,id,phone) =>
{
try
{
firebase.auth().createUserWithEmailAndPassword(name,email,Password,id,phone)
}
catch(error)
{
console.log(error.toString())
}
alert('signUp Successful')
}
render()
{
return(
<View style = {styles.container}>
<Input
placeholder='Enter Name'
onChangeText={(name) => this.setState({name})}/>
<Input
placeholder='Enter Email'
onChangeText={(email) => this.setState({email})}/>
<Input
placeholder='Enter Password'
onChangeText={(Password) => this.setState({Password})}/>
<Input
placeholder='Enter id'
onChangeText={(id) => this.setState({id})}/>
<Input
placeholder='Enter Phone'
onChangeText={(phone) => this.setState({phone})}/>
<View style={{marginTop : 40,flexDirection : 'row'}}>
<Button
title="Sign UP"
onPress = {() => this.signup(this.state.name,this.state.email,this.state.Password,this.state.id,this.state.phone)}/>
</View>
</View>
);
}
}
const styles = StyleSheet.create({
container :
{
flex : 1,
justifyContent : 'center',
alignItems : 'center',
}
});
export default App;
There is a compiler error which reads :
Invariant Violation: Text Strings must be rendered within a component
Where am I making a mistake? I have been dealing with this problem for a long time, thanks for your help.