更改印刷机状态

Question

当我点击TouchableOpacity时，我想更改我的文本元素内的字符串。但每当我点击它给我一个this.setState错误是不是一个函数。

这里是我的代码：

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类需要回调的背景下结合this（你的类的实例）。你可以用来React.createClass，做一些你在幕后绑定：

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

你也可以用arrow functions绑定：

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