首页 > 其他分享 >react native绑定触摸系统PanResponder组件中的Touch...组件onPress无法触发解决

react native绑定触摸系统PanResponder组件中的Touch...组件onPress无法触发解决

时间:2022-12-26 15:13:53浏览次数:79  
标签:... return gestureState react nav PanResponder 组件 type

import {
  View,
  Text,
  StatusBar,
  SafeAreaView,
  Image,
  ScrollView,
  TouchableOpacity,
  PanResponder,
} from 'react-native';


componentWillMount() {
    //滑动
    this._panResponder = PanResponder.create({
      onStartShouldSetPanResponder: (evt, gestureState) => {
        return true;
      },
      onMoveShouldSetPanResponder: (evt, gestureState) => {
 //解决PanResponder中的onPress无作用
        //当大于5时才进入移动事件,有的情况下需要将onStartShouldSetPanResponderCapture设为false
        if (Math.abs(gestureState.dx) > 5 || Math.abs(gestureState.dy) > 5) {
          return true;
        } else if (
          Math.abs(gestureState.dx) <= 5 ||
          Math.abs(gestureState.dy) <= 5
        ) {
          return false;
        }
      },
      onPanResponderGrant: (evt, gestureState) => {
        return false;
      },
      onPanResponderMove: (evt, gestureState) => {
        return false;
      },
      onPanResponderRelease: (evt, gestureState) => {
        //左移判断
        if (gestureState.dx > 50) {
          let nav_type = this.state.choose_type - 1;
          if (nav_type < 1) {
            return;
          }
          this._topNavigationCate(nav_type);
        } else if (gestureState.dx < -50) {
          //右移判断
          let nav_type = this.state.choose_type + 1;
          if (nav_type > 2) {
            return;
          }
          this._topNavigationCate(nav_type);
        }
      },
    });
  }
 return (
      <View style={styles.container} {...this._panResponder.panHandlers}>

(46条消息) react native——绑定触摸系统PanResponder组件中的Touch...组件onPress无法触发_Sixology.的博客-CSDN博客_panresponder
https://blog.csdn.net/qq_44685099/article/details/119319992

标签:...,return,gestureState,react,nav,PanResponder,组件,type
From: https://www.cnblogs.com/ianlab/p/17005839.html

相关文章