1.0.0 • Published 6 years ago

react-native-swipe-card v1.0.0

Weekly downloads
2
License
ISC
Repository
github
Last release
6 years ago

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

Propstypedescriptionrequireddefault
verticalThresholdnumber垂直方向,滑动距离超过该值时,card才会被移除No
horizontalThresholdnumber水平方向,滑动距离超过该值时,card才会被移除No
renderNoMoreCardsfunc当没有 Card 之后,显示的样式No
handleCurCardfunc当切换Card之后,调用该函数No

Card

Propstypedescriptionrequireddefault
styleobject单个卡片框的样式No
childrennode卡片的内容Yes