react-native – React Native onpress无法正常工作

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

导读：似乎没有调用onRadioPressed – 我做错了什么？我还需要获

似乎没有调用onRadioPressed – 我做错了什么？我还需要获取“clicked”项中包含的文本.

我相信我可以通过event.nativeEvent.text获得它,对吗？

谢谢你的帮助.

class RadioBtn extends React.Component {
  constructor(props) {
    super(props);
    this.state = {

    };
  }

  onRadioPressed(event) {
    console.log('RADIOBUTTON PUSHED:');
  }

  render() {

    return (
        <View style={styles.radioGrp}>
            <View style={styles.radioContainer}>
                <TouchableHighlight onpress={() => this.onRadioPressed.bind(this)} underlayColor='#f1c40f'>
                    <Text style={styles.radio}>Left</Text>
                </TouchableHighlight>
            </View>
            <View style={styles.radioContainer}>
                <TouchableHighlight onpress={() => this.onRadioPressed.bind(this)} underlayColor='#f1c40f'>
                    <Text style={styles.radio}>Right</Text>
                </TouchableHighlight>
            </View>
        </View>
    );
  }
}

所以在这里：

<TouchableHighlight onpress={() => this.onRadioPressed.bind(this)} underlayColor='#f1c40f'>
    <Text style={styles.radio}>Left</Text>
</TouchableHighlight>

首先将onpress更改为onPress. Here()=> this.onRadioPressed.bind(this)你指定一个箭头函数,它返回另一个函数this.onRadioPressed.bind(this)但是你永远不会触发它.

正确的方法：

// You can do either this
<TouchableHighlight onPress={() => this.onRadioPressed()} underlayColor='#f1c40f'>
    <Text style={styles.radio}>Left</Text>
</TouchableHighlight>

// Or you can do either this
<TouchableHighlight onPress={this.onRadioPressed.bind(this)} underlayColor='#f1c40f'>
    <Text style={styles.radio}>Left</Text>
</TouchableHighlight>

我建议查看这篇文章https://medium.com/@housecor/react-binding-patterns-5-approaches-for-handling-this-92c651b5af56#.irpdw9lh0

（编辑：李大同）

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