Viewpager 中的 TouchableHighlight 将页面更改事件视为 react-native 中的点击 ios

Question

我们在我们的应用程序中使用了 view pager (react-native-community/react-native-viewpager)，每个页面有 3 个部分，所有 3 个部分都是可点击的，为了使其可点击，我们使用 TouchableHighlight.

因此，每当我通过滑动来更改页面时。如果我的滑动触摸在 IOS 中的 TouchableHighlight 内，它会将其视为 android 中的其他点击，它工作正常。

Answer 1

发布此内容是为了帮助像我这样的其他用户。

本库开发者的回答。

嘿，您可以使用 onPageScrollStateChanged 方法来阻止按钮交互。

switch(pageScrollState){
   case "idle": enableButton();
   default: disableButton(); 
}

或者我用过这种方法

    this.state = {
            shouldEnableClick: true,
        };

    pageScroll = (event) => {
        draggingValue = event.nativeEvent.offset
        isNotStill = (draggingValue == 0 || draggingValue == 1) ? true : false
        {Platform.OS == 'ios' && this.changeValue(isNotStill)}
    }

    changeValue(isNotStill) {
        if (this.state.shouldEnableClick !== isNotStill) {
            this.setState({ shouldEnableClick: isNotStill })
        }
    }

在组件中我使用它就像

let enableCLick = this.state.shouldEnableClick
let clickAction = () => this.myAction()

<TouchableHighlight
      onPress={enableCLick && clickAction}/>

Viewpager 中的 TouchableHighlight 将页面更改事件视为 react-native 中的点击 ios

TouchableHighlight inside Viewpager taking page-change event as click in react-native ios

ios

react-native

touchablehighlight