Problem with React-Native Output View Component - reactjs

Question

this code does not Display the list(places) which places i added to it using add_Button.
Generally working of this code is this that i input text into this react-native app using TextInput Component, after this i press the Add Button to add this text into a list(places), after this it automatically display all the entered text.
e.g if i enter the place by 1st time it only display that text, but if i enter another text it displays that text as well as the first one.
import React, {Component} from 'react';
import {View, TextInput, StyleSheet, Button, Text} from 'react-native';
export default class App extends Component
{
state = {
placeName: "",
places: []
};
placeNameChangeHandler=(val)=>
{
this.setState({
InputValue: val
})
};
placeSubmitHandler = () =>{
if(this.state.placeName.trim() === "")
{
return;
}
this.setState(prevState => {
return {
places : prevState.places.concat(prevState.placeName)
};
});
};
render()
{
const placesOutput = this.state.places.map((place, i) =>(
<Text key={i} backgroundColor = 'black' >{place}</Text>
));
return(
<View style={Styles.container}>
<View style = {Styles.inputContainer}>
<TextInput
placeholder = "Search place?"
value = {this.setState.placeName}
onChangeText = {this.placeNameChangeHandler}
style={Styles.placeInput}
/>
<Button
title='Add'
style = {Styles.placeButton}
onPress = {this.placeSubmitHandler}
/>
</View>
<View>{placesOutput}</View>
</View>
);
}
}
const Styles = StyleSheet.create({
container: {
flex:1,
padding: 10,
backgroundColor: '#fff',
alignItems: 'center',
justifyContent: 'flex-start'
},
inputContainer: {
width: "100%",
flexDirection : 'row',
justifyContent: 'space-between',
alignItems:'center'
},
placeInput: {
width: "70%"
},
placeButton: {
width: "30%"
}
})

Answer 1

This is not 100% correct, but I'll write it down.
This seems to happen because of setState.
First.
Change to value = {this.setState.placeName} to value = {this.state.placeName}
<TextInput
placeholder = "Search place?"
value = {this.state.placeName}
onChangeText = {this.placeNameChangeHandler}
style={Styles.placeInput}
/>
Next.
Change setState in placeNameChangeHandler
placeNameChangeHandler=(val)=>{
this.setState({
placeName: val
})
};
And
Add Initializing placeName
placeSubmitHandler=()=>{
if(this.state.placeName.trim() === "")
{
return;
}
this.setState(prevState => {
return {
places : prevState.places.concat(prevState.placeName),
placeName : ""
};
});
};
Sorry for my stupid English.
I hope you understand :)