React Native Touchable 正在禁用 ScrollView [英] React Native Touchable is disabling ScrollView

问题描述

我是 React Native 的新手，所以我可能会问一些非常明显的问题，但请帮忙.

I'm new to React Native, so am probably asking something very obvious, but please help.

我有一个包含在可触摸中的视图，以便整个区域响应点击.然后在视图中嵌套一个 ScrollView.整体结构是这样的:

I have a view wrapped in a touchable, so that the whole area responds to tapping. Then have a ScrollView nested inside the view. The overall structure is something like this:

<TouchableWithoutFeedback onPress={this.handlePress.bind(this)}>
    <View>
        <ScrollView>
            <Text>Hello, here is a very long text that needs scrolling.</Text>
        <ScrollView>
    </View>
</TouchableWithoutFeedback>

当它编译并运行时，会检测到点击，但滚动视图根本不滚动.我使上面的代码简短而简单，但每个组件都有正确的样式，我可以看到一切都呈现良好，并且长文本在 ScrollView 的底部被截断.请帮忙.

When this compiles and runs, the tapping is detected, but the scroll view doesn't scroll at all. I made the above code short and simple, but each component has the proper styling and I can see everything rendering fine and the long text is cutoff at the bottom of the ScrollView. Please help.

谢谢！

推荐答案

这对我有用:

<TouchableWithoutFeedback onPress={...}>
  <View>
    <ScrollView>
      <View onStartShouldSetResponder={() => true}>
        // Scrollable content
      </View>
    </ScrollView>
  </View>
</TouchableWithoutFeedback>

onStartShouldSetResponder 属性停止向 TouchableWithoutFeedback 元素传播触摸事件.

The onStartShouldSetResponder prop stops the touch event propagation towards the TouchableWithoutFeedback element.

这篇关于React Native Touchable 正在禁用 ScrollView的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！