CarlosWGama

Aula - Formik

Jan 25th, 2023
65
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. import { useState } from 'react';
  2. import { Button, StyleSheet, Text, TextInput, View } from 'react-native';
  3.  
  4. export default function App() {
  5.  
  6.   const [ email, setEmail ] = useState('');
  7.   const [ senha, setSenha ] = useState('');
  8.   const [ resultado, setResultado ] = useState<null|'logado'|'falhou'>(null);
  9.  
  10.   const handleLogin = () => {
  11.     if (email.trim() == 'teste@teste.com' && senha.trim() == '123456')
  12.       setResultado('logado')
  13.     else
  14.       setResultado('falhou')
  15.   }
  16.  
  17.   return (
  18.     <View style={styles.container}>
  19.         <Text>Login</Text>
  20.         <TextInput  placeholder='Digite seu email' style={styles.textInput} onChangeText={setEmail}/>
  21.         <TextInput  placeholder='Digite sua senha' style={styles.textInput} onChangeText={setSenha} secureTextEntry/>
  22.         <Button title="Logar" onPress={handleLogin} />
  23.  
  24.         { resultado == 'logado' && <Text style={styles.success}>Logado com sucesso</Text>}
  25.         { resultado == 'falhou' && <Text style={styles.fail}>Email ou senha incorreto</Text>}
  26.     </View>
  27.   );
  28. }
  29.  
  30. const styles = StyleSheet.create({
  31.   container: {
  32.     padding: 20,
  33.     flex: 1,
  34.     justifyContent: 'center'
  35.   },
  36.   textInput: {
  37.     backgroundColor: 'lightgrey',
  38.     padding: 2,
  39.     marginVertical: 5
  40.   },
  41.   fail: {
  42.     textAlign:'center',
  43.     color: 'red'
  44.   },
  45.   success: {
  46.     textAlign:'center',
  47.     color: 'green'
  48.   }
  49. });
  50.  
Add Comment
Please, Sign In to add comment