React Native Touchable が ScrollView を無効にしています 質問する

React Native Touchable が ScrollView を無効にしています 質問する

私は React Native を初めて使用するので、おそらく非常に明白なことを尋ねていると思いますが、助けてください。

タッチ可能な要素でラップされたビューがあり、その領域全体がタップに反応します。次に、ビュー内に ScrollView をネストします。全体的な構造は次のようになります。

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

これをコンパイルして実行すると、タップは検出されますが、スクロール ビューはまったくスクロールしません。上記のコードは短くシンプルにしましたが、各コンポーネントには適切なスタイルが適用され、すべてが正常にレンダリングされ、長いテキストは ScrollView の下部で切り捨てられています。助けてください。

ありがとう!

ベストアンサー1

私にとってはこれが効果的でした:

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

このonStartShouldSetResponderプロパティは、要素へのタッチ イベントの伝播を停止しますTouchableWithoutFeedback

おすすめ記事