I'm New to react native,
I'm Building a sample app and when entering data to TextInput field I'm Getting the warning.
I tried running it on Android emulator and on my Pocophone f1 device and got the same results.
I'm using VS Code as my IDE.
I'm Developing on Ubuntu 18.04
Can anyone help?
These are screenshots of the app
This is my Code
/**
* Sample React Native App
* https://github.com/facebook/react-native
*
* @format
* @flow
*/
import React, {Component} from 'react';
import {Platform, StyleSheet, Text, View, TextInput, Button} from 'react-native';
//type Props = {};
export default class App extends Component {
state = {
placeName: "",
places: []
}
placeNameChangedHandler = (event) => {
this.setState({
placeName: event
});
}
placeNameSubmitHandler = () => {
if (this.state.placeName === ""){
return;
}
this.setState(prevState => {
return {
places: prevState.places.concat(prevState.placeName)
};
});
};
render() {
const placesOutput = this.state.places.map(place => (
<Text>{place}</Text>
));
return (
<View style={styles.container}>
<View style={styles.inputContainer}>
<TextInput
style={{width: 200, borderColor: "black", borderWidth: 1}}
placeholder="Place Name"
value={this.state.placeName}
onChangeText={this.placeNameChangedHandler}
style={styles.PlaceInput} />
<Button title="Add" style={styles.placeButton} onPress={this.placeNameChangedHandler} />
</View>
<View>
{placesOutput}
</View>
</View>
);
}
}
const styles = StyleSheet.create({
container: {
flex: 1,
padding: 26,
justifyContent: 'space-between',
alignItems: 'center',
backgroundColor: '#F5FCFF',
},
inputContainer:{
width: "100%",
flexDirection: "row",
justifyContent: "space-between",
alignItems: 'center'
},
PlaceInput:{
width: "70%"
},
placeButton:{
width: "30%"
}
});
I changed the code as suggested in the answer below and got an error as shown in the screen below
I found the issue: on the **onPress event handler I called the wrong function, sorry for the time I wested **