Javascript 不变冲突:对象作为React子对象无效(React Native)
我正试图实现一个简单的功能,按下一个按钮,它应该添加地名的地方数组,并显示在视图中,但我似乎得到了一个错误,请帮助 这是我的密码Javascript 不变冲突:对象作为React子对象无效(React Native),javascript,reactjs,react-native,Javascript,Reactjs,React Native,我正试图实现一个简单的功能,按下一个按钮,它应该添加地名的地方数组,并显示在视图中,但我似乎得到了一个错误,请帮助 这是我的密码 export default class App extends Component{ state = { placeName: "", places: [] } onChangeName = (val) => { this.setState({ placeName: val }) } pla
export default class App extends Component{
state = {
placeName: "",
places: []
}
onChangeName = (val) => {
this.setState({
placeName: val
})
}
placeSubmitHandler = () => {
if(this.state.placeName === "") {
alert('enter something');
} else {
this.setState(prevState => {
return {
places: prevState.places.concat(prevState.placeName)
}
})
}
}
render() {
const placesOutput = this.state.places.map((place, i) => (
<Text key={i}>{place}</Text>
));
return (
<View style={styles.container}>
<View style={styles.inputContainer}>
<TextInput
style={{width: 300}}
value={this.state.textInput}
placeholder='enter anything'
onChange={this.onChangeName}
style={styles.placeInput}
/>
<Button title='Add' style={styles.placeButton} onPress={this.placeSubmitHandler}/>
</View>
<View>
{placesOutput}
</View>
</View>
);
}
}
我不熟悉react native,所以对此我一无所知。您的placesOutput变量正在以jsx的形式返回一个对象 而不是
const placesOutput = this.state.places.map((place, i) => (
<Text key={i}>{place}</Text>
));
试一试
placesOutput变量正在以jsx的形式返回一个对象 而不是
const placesOutput = this.state.places.map((place, i) => (
<Text key={i}>{place}</Text>
));
试一试
在您的应用程序中,您使用的是onChange道具而不是onChangeText,因此您正在尝试在一个场景中渲染对象。只要改变道具,它就应该工作了
<TextInput
style={styles.placeInput}
value={this.state.textInput}
placeholder="enter anything"
onChangeText={this.onChangeName}
/>
在您的应用程序中,您使用的是onChange道具而不是onChangeText,因此您正在尝试在一个场景中渲染对象。只要改变道具,它就应该工作了
<TextInput
style={styles.placeInput}
value={this.state.textInput}
placeholder="enter anything"
onChangeText={this.onChangeName}
/>
检查它可能会帮助你检查它可能会帮助你我使用了一些随机属性作为示例。您应该使用place对象可能具有的任何属性。试着看看它是否有效。是的,它是一个对象,我太傻了……它现在工作得很好,谢谢。我用了一些随机属性作为例子。您应该使用place对象可能具有的任何属性。试着看看它是否有效。是的,它是一个物体,我太傻了……它现在可以工作了,谢谢
style={[styles.placeInput, {width: 300}]}