按时更改状态

【问题标题】：Change State on Press按时更改状态
【发布时间】：2015-11-06 09:39:21
【问题描述】：

我想在点击 TouchableOpacity 时更改 Text 元素中的字符串。但是每当我点击它时，它都会给我一个 this.setState is not a function 的错误。

这是我的代码：

constructor(props) {
    super(props);
    this.state = {
        sampleText: "Click Here"
    };
}

clickText() {
    this.setState({
        sampleText: 'Hello World'
    });
}
render() {
    return (
        <View style={styles.container}>
            <TouchableOpacity onPress={this.clickText}>
                <View style={[styles.avatar, styles.avatarContainer]}>
               <Text>{this.state.sampleText}</Text>
                </View>
            </TouchableOpacity>

        </View>
    );
}

【问题讨论】：

标签： ios reactjs react-native

【解决方案1】：

对于React.Component es6 类，您需要将回调的上下文绑定到this（您的类实例）。你可能习惯了React.createClass，它在幕后为你做了一些绑定：

<TouchableOpacity onPress={this.clickText.bind(this)}>

你也可以绑定arrow functions:

<TouchableOpacity onPress={e => this.clickText(e)}>

【讨论】：