reactjs - 可触摸的不透明标题 React Native

Question

我希望我的反应导航栏中的标题是可点击的，并且当我点击时会弹出一个菜单，我试图首先弹出一个日志或警报，但是当我点击时它不会在屏幕呈现时打开它

这是一个链接，我在其中使用 onPress 向标题添加了一个自定义组件，但它只会触发 onRender

https://snack.expo.io/r10TGyieE

我究竟做错了什么？

Answer 1

您的 onPress 事件没有绑定，因此它会在您运行应用程序时首先触发。

使用 Es6 箭头函数时，默认情况下您的函数是绑定的。onPress={()=>this.someFunction()}

否则你需要手动绑定onPress={this.someFunction.bind(this)}来调用你的函数。

class LogoTitle extends React.Component {
  render() {
    return (
      <TouchableOpacity onPress={()=>alert('test')}>
        <Text style={{ color: "white", fontWeight:'bold' }}> List Layout</Text>
      </TouchableOpacity>
    );
  }
}

Answer 2

https://snack.expo.io/HJvXPJix4

你需要让它调用onPress={() => this.someAction()}而不是onPress={this.someAction()}

Answer 3

就像 Dadsquatch 说的，

这个：

onPress={this.someAction()}

被认为是直接代码，一旦应用程序到达它所在的行，它就会被执行（这就是它在启动时执行的原因，尽管你在启动时没有提到它）

但是当你使用时：

onPress={() => this.someAction()}

你告诉编译器，这是发生 onPress 时要执行的函数。而且你可以看到它是一个箭头函数格式。

Answer 4

正如塔雷克所说，您可以使用它

要不然

onPress={this.someAction}

因为 onPress 方法调用了一个函数，所以你可以直接写函数名。