react-native – 无法在touchablehighlight onpress中设置state

发布时间：2020-12-15 09:32:08 所属栏目：百科来源：网络整理

导读：当我尝试在touchablehighlight onpress中设置状态时,我的应用程序崩溃了.这就是我得到的： TouchableHighlight onPress={this.setState({toggleCharacter: false})} Image style={styles.tekstballon} source={tekstballon} //TouchableHighlight 我的最终目

当我尝试在touchablehighlight onpress中设置状态时,我的应用程序崩溃了.这就是我得到的：

<TouchableHighlight onPress={this.setState({toggleCharacter: false})}>
    <Image style={styles.tekstballon} source={tekstballon} />
</TouchableHighlight>

我的最终目标是切换toggleCharacter,所以如果它是假的我想将它设置为true,如果它是真的我想将它设置为false但我不知道如何.

解决方法

您在渲染时立即调用该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>
    );
  }
}

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!