React Native:可滑动和可触摸

React Native: Swipeable and Touchable

本文关键字：触摸 React Native      更新时间：2023-09-26

我想在视图的一个容器中注册三个手势:

  1. 当用户触摸卡片时->加载卡片的详细信息
  2. 当用户向下滑动卡片时->"喜欢"它并显示下一张卡片
  3. 当用户滑动卡片->"跳过"它并显示下一张卡片

我目前的实现使用PanHandler来注册手势，并使用TouchableOpacity来减少刷卡时的不透明度。

但是我不确定如何在同一张卡片上实现上述三种手势。

你可以使用<TouchableHighlight />(或任何其他'Touchable'组件)嵌套在<Swipeable />组件内(通常使用react-native-swipeable库实现)。

就像这样:

{/* Props are not set in this example for simplicity */}
<Swipeable>
    {/* You should of course nest some components in the next element if you want to */}
    <TouchableHighlight />
</Swipeable>

我自己把它修好了。

顺便说一下:嵌套元素的其他方式(如<TouchableHighlight><Swipeable /></TouchableHighlight>)给了我很多问题，所以我不建议这样做。

相关文章：