ios - 按下时更改状态

Question

我想在点击 TouchableOpacity 时更改文本元素内的字符串。但是每当我点击它时，它都会给我一个 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>
    );
}

Answer 1

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

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

您还可以使用 arrow functions 进行绑定(bind):

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