An input field has been added to <App />
and it has a method called onChange
.
But the app doesn’t work.
Pass the correct handler to onChange
to make it work.
This task is part of the Full-Stack JavaScript Course
If you have any issues with it, you can ask for community help below the post
Feel free to help others if you’ve already solved the task
App.js
import React, { useState } from 'react';
import { Dimensions, StyleSheet, TextInput, View } from 'react-native';
export default function App() {
const [value, setValue] = useState('');
return (
<View style={styles.container}>
<TextInput value={value} onChange={setValue} />
</View>
);
}
const styles = StyleSheet.create({
container: {
flex: 1,
backgroundColor: '#56c7c0',
alignItems: 'center',
justifyContent: 'center',
},
input: {
marginVertical: 30,
borderWidth: 2,
borderColor: '#ffb900',
backgroundColor: '#ffffff',
padding: 10,
borderRadius: 10,
width: 0.8 * Dimensions.get('screen').width,
},
});
app.json
{
"expo": {
"name": "1",
"slug": "1",
"version": "1.0.0",
"orientation": "portrait",
"icon": "./assets/icon.png",
"splash": {
"image": "./assets/splash.png",
"resizeMode": "contain",
"backgroundColor": "#ffffff"
},
"updates": {
"fallbackToCacheTimeout": 0
},
"assetBundlePatterns": [
"**/*"
],
"ios": {
"supportsTablet": true
},
"android": {
"adaptiveIcon": {
"foregroundImage": "./assets/adaptive-icon.png",
"backgroundColor": "#FFFFFF"
}
},
"web": {
"favicon": "./assets/favicon.png"
}
}
}