子コンポーネントのPanResponderを無効にする方法 - ネイティブに反応する

Question

フレンド親とビューの1つのビューを取ることにします。私は1つのTouchableOpacityを取ります。私はメインビューにpanResponderを追加し、メインビューのタッチがうまく動作したら。しかし、TouchableOpacityが機能していない、私はTouchableOpacity上のpanResponderを削除したい。 TouchableOpacityが機能するように。パンは親ビューに追加

this._panResponder = PanResponder.create({ 
     // Ask to be the responder: 
     onStartShouldSetPanResponder: (evt, gestureState) => true, 
     onStartShouldSetPanResponderCapture: (evt, gestureState) => true, 
     onMoveShouldSetPanResponder: (evt, gestureState) => true, 
     onMoveShouldSetPanResponderCapture: (evt, gestureState) => true, 


     onPanResponderGrant: (evt, gestureState) => { 
     // The gesture has started. Show visual feedback so the user knows 
     // what is happening! 

     // gestureState.d{x,y} will be set to zero now 

     // this.toggleModal() 
     }, 
     onPanResponderMove: (evt, gestureState) => { 
     // The most recent move distance is gestureState.move{X,Y} 

     // The accumulated gesture distance since becoming responder is 
     // gestureState.d{x,y} 
     console.log('onPanResponderMove'); 
     }, 
     onPanResponderTerminationRequest: (evt, gestureState) => true, 
     onPanResponderRelease: (evt, gestureState) => { 
     // The user has released all touches while this view is the 
     // responder. This typically means a gesture has succeeded 
     console.log('onPanResponderRelease'); 

     this.toggleModal() 
     }, 
     onPanResponderTerminate: (evt, gestureState) => { 
     // Another component has become the responder, so this gesture 
     // should be cancelled 

     console.log('onPanResponderTerminate'); 

     }, 
     onShouldBlockNativeResponder: (evt, gestureState) => { 
     // Returns whether this component should block native components from becoming the JS 
     // responder. Returns true by default. Is currently only supported on android. 

     console.log('onShouldBlockNativeResponder'); 

     return true; 
     }, 
    }); 
} 

：

コードMAINVIEWにパンを追加するとき

render() { 
    return (
     <View {...this._panResponder.panHandlers}> 
     <TouchableOpacity onPress={this._onPressButton}> 
     <Image 
      style={styles.button} 
      source={require('./myButton.png')} 
     /> 
     </TouchableOpacity> 
     </View> 
    ); 
    }, 

をボタンたonPressイベントが機能していません。

Answer 1

この行を変更してからTouchablesイベントを取得します。

trueを返すと、子がレスポンダにならないようになります。 documentから

onStartShouldSetPanResponderCapture: (evt, gestureState) => false, 

：親ビューがタッチ開始に レスポンダになってから子供を防ぐために望んでいる場合

だから、それはtrueを返しますonStartShouldSetResponderCapture ハンドラを持っている必要があります。このリンクは、あなたが（http://browniefed.com/blog/react-native-maintain-touchable-items-with-a-parent-panresponder/）[親PanResponderで触れることができるアイテムを維持]を助けるwilll