阵营：忽略触摸事件从孩子到家长

Question

我被困在阵营本地一个问题： 我有我的简单视图层次为：

<View><MapView/></View> 

我要听的的的onClick监听器Root View并根据这些监听器做某些动作。同时，我希望我的用户使用Mapview进行操作，在不触发父母的意图的情况下执行某些类型的触摸交互（他们不幸的是：根据经验为亲 - 小孩大拇指）

<View><MapView pointerEvents="none"/><View> 

不知何故，但它不会提供我与MapView进行交互。我正在寻找一种方式，我们可以与MapView进行交互，同时Touch事件也不会被触发到父视图。 :)

Answer 1

**

捕捉ShouldSet处理程序

**

onStartShouldSetResponder和onMoveShouldSetResponder被称为与冒泡图案，如最深节点称为第一。这意味着当ShouldSetResponder处理程序的多个视图返回true时，最深的组件将成为响应者。这在大多数情况下是可取的，因为它确保所有控件和按钮都可用。

假设您有一个简单的视图层次结构。

样品-1

在这种情况下视图2被第一控制，因为它返回真就变得可点击

<View onStartShouldSetResponder={(evt) => return true}> //View1 
<View onStartShouldSetResponder={(evt) =>//do something return true}>//View2 
</View> 
</View> 

样品-2

在这种情况下视图2是首先被控制，因为它返回false它不可点击，然后View1被控制，因为它返回true，它变成可点击的。

<View onStartShouldSetResponder={(evt) => //do something return true}> //View1 
<View onStartShouldSetResponder={(evt) => return false}>//View2 
</View> 
</View> 

该层次结构在与组件一起使用时很有用。例如，你想创建一个组件调用MapView类和你想被点击，或者不根据你使用它的分量。

class mapView extends Component 
{ 
    . 
    . 
    render(){ 
return(
    <View onStartShouldSetResponder={(evt) => return {this.props.shouldBeClickable}> 
    . 
    . 
    </View> 
) 
} 
} 


-make your parent component clickable 
class oneOfyourComponentUsingMapView extends Component 
    { 
     . 
     . 
     render(){ 
    return(
     <View onStartShouldSetResponder={(evt) =>//do something return true> 
     <MapView shouldBeClickable={false}> 
     . 
     . 
     </MapView> 
     </View> 
    ) 
    } 
    } 

-make你的孩子组件可点击

class oneOfyourComponentUsingMapView2 extends Component 
     { 
      . 
      . 
      render(){ 
     return(
      <View> 
      <MapView shouldBeClickable={true}> 
      . 
      . 
      </View> 
      </View> 
     ) 
     } 
     } 

https://facebook.github.io/react-native/docs/gesture-responder-system.html