当按下另一个可触摸的不透明度时,一个可触摸的不透明度不会按下

Posted

技术标签:

【中文标题】当按下另一个可触摸的不透明度时,一个可触摸的不透明度不会按下【英文标题】:One touchable opacity doesn't press when another touchable opacity is pressed 【发布时间】:2020-07-15 10:53:50 【问题描述】:

我在 React native 中制作了一个程序,其中有两个按钮,按下时会增加一个点击计数器。 问题是当一个按钮被按下时,另一个按钮不会响应并且不会增加计数器。按钮由 Touchableopacity 制成,动作由 onPress 完成。

<View style = flex:1,flexDirection:'row',justifyContent:'center'>
            <View>
            <TouchableOpacity style = styles.button
            onPress = () => this.start() 
            >
              <Text style=styles.buttonText>
                Tap
              </Text>
            </TouchableOpacity>
            </View>
            <View>
            <TouchableOpacity style = styles.button
            onPress = () => this.start() >
              <Text style=styles.buttonText>
                Tap
              </Text>
            </TouchableOpacity>
            </View>
          </View>
</View>

【问题讨论】:

你能显示一些代码吗? 您可以尝试将按键传递给您的按钮吗?很难做出反应来知道你到底在按什么,否则可能会导致错误 【参考方案1】:

尝试使用onTouchStart 而不是onPress

所以改变:

<TouchableOpacity style=styles.button onPress=() => this.start()>

收件人:

<TouchableOpacity style=styles.button onTouchStart=() => this.start()>

您想要这样做的原因是,当一个按钮仍被按下时,另一个按钮上的 onPress 操作在您停止按下原始按钮之前不会触发。

【讨论】:

【参考方案2】:

我通过使用 and onTouchStart 而不是 and onPress 解决了这个问题

【讨论】:

【参考方案3】:

我不知道之前的海报使用的是什么版本的 React Native,但“onTouchStart”仅在 View 组件上可用,而不是在 Touchable Opacity 上。

将我的可触摸对象包装在视图中可以很好地模仿 onPress 行为

<View onTouchStart=myEventHandler>
  <TouchableOpacity>
    <Text>My Touchable Button</Text>
  </TouchableOpacity>
</View>

【讨论】:

以上是关于当按下另一个可触摸的不透明度时,一个可触摸的不透明度不会按下的主要内容,如果未能解决你的问题,请参考以下文章

可触摸的不透明标题反应原生

如何在 React Native 的平面列表中的可触摸不透明度内执行函数?

使用TouchableOpacity onpress的图像不能反应原生

React Native之Touchable四组件

TouchableOpacity 覆盖其他按钮

React Native FlatList 可触摸不透明度