CarlosWGama icon

Aula - Formik

CarlosWGama | PRO | 01/25/23 08:45:19 PM UTC | 0 ⭐ | 513 👁️ | Never ⏰ | []
TypeScript |

1.38 KB

|

None

|

0 👍

/

0 👎

import { useState } from 'react';
import { Button, StyleSheet, Text, TextInput, View } from 'react-native';
 
export default function App() {
 
  const [ email, setEmail ] = useState('');
  const [ senha, setSenha ] = useState('');
  const [ resultado, setResultado ] = useState<null|'logado'|'falhou'>(null);
  
  const handleLogin = () => {
    if (email.trim() == '[email protected]' && senha.trim() == '123456') 
      setResultado('logado')
    else
      setResultado('falhou')
  }
 
  return (
    <View style={styles.container}>
        <Text>Login</Text>
        <TextInput  placeholder='Digite seu email' style={styles.textInput} onChangeText={setEmail}/>
        <TextInput  placeholder='Digite sua senha' style={styles.textInput} onChangeText={setSenha} secureTextEntry/>
        <Button title="Logar" onPress={handleLogin} />
 
        { resultado == 'logado' && <Text style={styles.success}>Logado com sucesso</Text>}
        { resultado == 'falhou' && <Text style={styles.fail}>Email ou senha incorreto</Text>}
    </View>
  );
}
 
const styles = StyleSheet.create({
  container: {
    padding: 20,
    flex: 1,
    justifyContent: 'center'
  },
  textInput: {
    backgroundColor: 'lightgrey',
    padding: 2,
    marginVertical: 5
  },
  fail: {
    textAlign:'center',
    color: 'red'
  },
  success: {
    textAlign:'center',
    color: 'green'
  }
});
 

Comments

  •  icon
    01/01/70 12:00:00 AM UTC
    Plain Text |

    0 B

    |

    👍

    /

    👎