当我尝试在 touchablehighlight onpress 中设置状态时,我的应用程序崩溃了。这是我得到的:
<TouchableHighlight onPress={this.setState({toggleCharacter: false})}>
<Image style={styles.tekstballon} source={tekstballon} />
</TouchableHighlight>
我的最终目标是切换
toggleCharacter
所以如果它是假的,我想把它设置为真,如果是真的,我想把它设置为假,但我不知道怎么做。
最佳答案
您正在渲染时立即调用该 setState 调用。您需要将其包装在一个将在 onPress 上调用的函数中,即:
<TouchableHighlight onPress={() => this.setState({toggleCharacter: false})}>
请记住,上面的内容有点令人不悦,因为它为每个实例创建了一个新函数,但它只是为了让您了解为什么会出现错误(将其添加到类本身会提高一点性能。 )
编辑以回答评论。上面提到的“更好”的方法是:
class myComponent extends React.Component {
/*
...ctor and methods above
The below assumes Property initializer syntax is available.
If not, you need to autobind in the constructor
/*
handleOnPress = () => this.setState({ toggleCharacter: false })
render() {
return (
<TouchableHighlight onPress={this.handleOnPress}>
<Image style={styles.tekstballon} source={tekstballon} />
</TouchableHighlight>
);
}
}
关于react-native - 无法在 touchablehighlight onpress 中设置状态,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40195812/