小编sun*_*une的帖子

我遇到了一个问题，嵌套 Touchable 中的双击（同时触摸）到达父 Touchable。

在下面的示例中，Touchable 嵌套了三层深。当我按下最深的可触摸（蓝色）时，控制台正确打印“蓝色”。当我按下分别打印“绿色”和“红色”的其他图层时，它的行为也正确。

当我同时进行两次触摸和释放时会出现奇怪的行为 - 然后根本不会调用触摸层的 onPress 。相反，当两个触摸都结束时，父 Touchable 只接收一次触摸。

此外，当我在最外层（红色，没有父级可触摸）执行两个同时触摸时-该层将接收触摸。从我的角度来看，这似乎更正确，但与上述嵌套 Tocuables 中的怪异行为背道而驰。

<View style={{flex:1, backgroundColor:"#666666"}}>

    <TouchableHighlight onPress={()=>{console.log("red")}}>
      <View style={{backgroundColor:"#FF0000", height:300}}>   
        <TouchableHighlight onPress={()=>{console.log("green")}}>
          <View style={{backgroundColor:"#00FF00", height:200}}>
            <TouchableHighlight onPress={()=>{console.log("blue")}}>
              <View style={{backgroundColor:"#0000FF", height:100}} />
            </TouchableHighlight>
          </View>
        </TouchableHighlight>
      </View>
    </TouchableHighlight>
</View>

我遇到了 TouchableHighlight 和 TouchableOpacity 在渲染时做出视觉反应的行为（未调用 onPress）。

有一件事是，当我进入页面并且按钮发出轻微的“闪烁”时，它看起来有点奇怪。这很奇怪，但可以忍受。更令人沮丧的是，如果我改变父组件的状态并因此调用 re-render()，按钮将再次“闪烁”，使得每当我改变状态时所有按钮都会闪烁。

按下按钮会改变页面状态，因此按下按钮会使两个按钮“闪烁”。

我使用react-redux，但这不应该影响这种行为。

下面的代码仅用于说明。

render()
{
    return(
        <View>
            <ToucableHightlight> //Click here changes state
                <Content/>
            </ToucableHightlight>
            <ToucableHightlight>  //Click here changes state
                <Content/>
            </ToucableHightlight>
        <View>
    );
}