当我尝试在touchablehighlight onpress中设置状态时,我的应用程序崩溃了。这就是我得到的:
<TouchableHighlight onPress={this.setState({toggleCharacter: false})}>
<Image style={styles.tekstballon} source={tekstballon} />
</TouchableHighlight>
我的最终目标是切换toggleCharacter
所以如果它是假的我想把它设置为真,如果它是真的我想把它设置为假,但我不知道如何。< / p>
答案 0 :(得分:7)
您正在渲染时立即调用该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>
);
}
}