自动调用 React Native onPress

Question

我在使用 react-native onPress 功能时遇到问题。 onPress 应该只在它实际被触摸事件触发时才起作用（我想），即当我按下屏幕上的按钮时。但似乎 onPress 在调用渲染函数时会自行触发。当我尝试手动按下时，它不起作用。

   import React, { Component } from 'react';
  import { PropTypes, Text, View ,Alert } from 'react-native';
  import { Button } from 'react-native-material-design';

export default class Home extends Component {

  render() {
    return (
          <View style={{flex:1}}>
            <Button value="Contacts" raised={true} onPress={this.handleRoute('x')} />
            <Button value="Contacts" raised={true} onPress={this.handleRoute('y')} />
            <Button value="Contacts" raised={true} onPress={this.handleRoute('z')} />
          </View>
          );
}
handleRoute(route){
  alert(route) // >> x , y, z
    }
}

  module.exports = Home;

我错过了什么？我分配的方式有问题还是这是一些错误？任何建议都受到高度赞赏。

视频

原文由 Sijan Shrestha 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

尝试改变

onPress={this.handleRoute(‘x’)} // 在这种情况下，一旦渲染发生，handleRoute 函数就会被调用

至

onPress={() => this.handleRoute.bind(‘x’)} //在这种情况下，handleRoute 不会在渲染发生时立即调用

原文由 Manjeet Singh 发布，翻译遵循 CC BY-SA 3.0 许可协议