![](/img/trans.png)
[英]React Native - State doesn't change correctly on button press (TouchableHighlight)
[英]React Native button doesn't change the state
按代码中指定的按钮后,应用程序的状态不会更改。
import React from 'react'
import { View, Text, TextInput, Button} from 'react-native'
export default class App extends React.Component {
constructor() {
super()
this.state = {
text: '',
displayText: true
}
}
render() {
return (
<View>
<TextInput
onChangeText={(text) => this.setState({text})}
/>
<Button
onPress={(prevState) => this.setState({displayText: !prevState.displayText})}
title="Display"
/>
{this.state.displayText ? <Text>{this.state.text}</Text> : null}
</View>
)
}
}
如果修改了传递给onPress的函数,以便将displayText更改为false,则它将按预期工作(隐藏文本)。 问题很可能出在这部分。
<Button
onPress={(prevState) => this.setState({displayText: !prevState.displayText})}
title="Display"
/>
<Button
onPress={(prevState) => this.setState({displayText: !prevState.displayText})}
title="Display"
/>
是错误的,prevState参数来自setState作为函数,而不是来自onPress事件:)
应该是
<Button
onPress={() => this.setState({displayText: !this.state.displayText})}
title="Display"
/>
要么
<Button
onPress={() => this.setState(prevState => {displayText: !prevState.displayText})}
title="Display"
/>
尝试这个
<Button
onPress={() => this.setState({displayText: !this.state.displayText})}
title="Display"
/>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.