<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<!------ Include the above in your HEAD tag ---------->
import React, { Component, useEffect, useState } from 'react';
import { View, Text, StyleSheet, TextInput } from 'react-native';
import SplashScreen from 'react-native-splash-screen'
// create a component
const App = () => {
useEffect(() => {
setTimeout(() => {
SplashScreen.hide();
}, 1000);
}, [])
const [upDateData, setUpdateData] = useState({
name: '',
email: '',
pass: '',
})
const { name, email, pass,em } = upDateData;
const updateState = data => setUpdateData(state => ({...state, ...data}));
const onChangeTextResult = (key, value) =>{
console.log(key, value, "key");
updateState({
[key]:value
})
}
return (
<View style={styles.container}>
{/* <Text>App</Text> */}
<TextInput
placeholder='name'
style={{ borderColor: 'grey', borderWidth: 2, padding: 15 }}
value={name}
onChangeText={(value)=>onChangeTextResult('name', value)}
/>
<TextInput
placeholder='email'
style={{ borderColor: 'grey', borderWidth: 2, padding: 15 }}
value={email}
onChangeText={(value)=>onChangeTextResult('email', value)}
/>
<TextInput
placeholder='password'
style={{ borderColor: 'grey', borderWidth: 2, padding: 15 }}
value={pass}
onChangeText={(value)=>onChangeTextResult('pass', value)}
/>
<Text>{name} {email} {pass}</Text>
</View>
);
};
// define your styles
const styles = StyleSheet.create({
container: {
flex: 1,
justifyContent: 'center',
alignItems: 'center',
// backgroundColor: '#2c3e50',
},
});
//make this component available to the app
export default App;
