Как отключить PanResponder для дочернего компонента - React Native

Друг, я возьму один просмотр родителей, а внутри просмотра возьму один TouchableOpacity. Я добавлю panResponder на главном экране, и при прикосновении к главному экрану все работает нормально. Но TouchableOpacity не работает, я хочу удалить panResponder на TouchableOpacity. Так что 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;
      },
    });
 }

Пан добавил на Родительский вид:

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

Событие Button OnPress не работает при добавлении Pan на mainView.

1 ответ

Решение

Измени эту строку, затем внутреннюю Touchables получит событие.

возвращая истину, это не позволит ребенку стать респондентом.

  onStartShouldSetPanResponderCapture: (evt, gestureState) => false,

Из документа:

Поэтому, если родительское представление хочет запретить дочернему элементу стать респондентом при сенсорном запуске, он должен иметь обработчик onStartShouldSetResponderCapture, который возвращает значение true.

Другие вопросы по тегам