Tengo una base de datos json en la que tengo usuarios con un nombre y una contraseña para que se puedan logear en mi app.
A la hora de hacer el fetch y hacer la validación del usuario y la contraseña contra la base de datos tengo un error; si la contraseña y el usuario introducidos por el usuario coinciden con los de la base de datos, pasa a la pantalla principal y si no salta un alert diciendo que hay un error. Pues bien, si el usuario y la contraseña coinciden con la base de datos, pasa correctamente a la pantalla principal pero aún así salta el alert de que ha habido un error y no se muy bien el por qué. Os adjunto mi código.
export class LoginPage extends Component {
constructor(props) {
super(props);
this.state = {
username: '',
password: '',
isLoading: false,
dataSource: [],
validated: false,
url: 'http://localhost:3000/usuaris'
};
}
getData = () => {
this.setState({isLoading: true})
fetch(this.state.url)
.then(res => res.json())
.then(res => {
this.setState({
dataSource: res,
isLoading: false
})
let filter = this.state.dataSource.filter(item => {
if(item.username == this.state.username && item.password == this.state.password){
this.props.navigation.navigate('Home', { username: this.state.username });
return;
}else{
alert("Error")
}
})
this.setState({
dataSource: filter,
})
});
};
render(){
return(
<View style={styles.mainContainer}>
<View style={styles.logoContainer}>
<Image source={require('../images/floridaLogo.png')} style={{width: 250}}></Image>
</View>
<View style={styles.void}></View>
<View style={styles.textContainer}>
<TextInput
placeholder="Nombre de usuario"
placeholderTextColor="rgba(253,110,110,1)"
style={styles.name}
maxLength={12}
onChangeText={(username) => this.setState({username})}
value={this.state.username}
></TextInput>
<View style={styles.underline}></View>
<TextInput
placeholder="Contraseña"
placeholderTextColor="rgba(253,110,110,1)"
style={styles.name}
onChangeText={(password) => this.setState({password})}
value={this.state.password}
></TextInput>
<View style={styles.underline}></View>
</View>
<View style={styles.buttonLoginContainer}>
<TouchableOpacity style={styles.buttonLogin} onPress ={ () => this.getData()}>
<Text style={styles.textButton}>Acceder</Text>
</TouchableOpacity>
</View>
Espero haberme explicado bien Gracias de antemano.