react-native-swipe-card

一个支持手势切换的卡片组，支持依次返回切掉的卡片

Preview

使用 Demo

import { CardStack, Card } from '../components/SwipeCard'


<CardStack
  ref={ref => (this.cardStack = ref)}
  style={styles.container}
  handleCurCard={this.getCurIndex}
  renderNoMoreCards={() => <Text>再也没有了！！</Text>}
  >
  {clothes.map((cloth, index) => (
    <Card style={[styles.card]} key={index}>
      <Image source={cloth} style={{ width: windowWidth - 20, height: 500 }} />
    </Card>
  ))}
</CardStack>

Props

CardStack

Props	type	description	required	default
verticalThreshold	number	垂直方向，滑动距离超过该值时，card才会被移除	No
horizontalThreshold	number	水平方向，滑动距离超过该值时，card才会被移除	No
renderNoMoreCards	func	当没有 Card 之后，显示的样式	No
handleCurCard	func	当切换Card之后，调用该函数	No

Card

Props	type	description	required	default
style	object	单个卡片框的样式	No
children	node	卡片的内容	Yes