無法在touchablehighlight onpress中設置狀態

Question

當我嘗試在touchablehighlight onpress中設置狀態時，我的應用程序崩潰。這是我的了：

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

我的最終目標是要切換toggleCharacter所以如果是假的我想將它設置爲true，如果這是真的，我想將它設置爲false，但我不知道如何。

Answer 1

您正在渲染時立即調用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> 
    ); 
    } 
}