Need help with swipeout?
Click the “chat” button below for chat support from the developer who created it, or find similar developers for support.

About the developer

react-component
211 Stars 56 Forks 101 Commits 23 Opened issues

Description

React Swipeout(web & react-native)

Services available

!
?

Need anything else?

Contributors list

rc-swipeout


iOS-style swipeout buttons that appear from behind a component (web & react-native support)

NPM version build status Test coverage

Screenshots

rc-swipeout

Installation

npm install --save rc-swipeout

Development

web:
npm install
npm start

rn: tnpm run rn-start

Example

  • local: http://localhost:8000/examples/
  • online: http://react-component.github.io/swipeout/

react-native

./node_modules/rc-tools run react-native-init
react-native run-ios

Usage

import Swipeout from 'rc-swipeout';
import 'rc-swipeout/assets/index.less'; (web only)

console.log('reply'), style: { backgroundColor: 'orange', color: 'white' }, className: 'custom-class-1' } ]} right={[ { text: 'delete', onPress:() => console.log('delete'), style: { backgroundColor: 'red', color: 'white' }, className: 'custom-class-2' } ]} onOpen={() => console.log('open')} onClose={() => console.log('close')} >

swipeout demo

API

props

| name | description | type | default | |-------------|------------------------|--------|------------| | prefixCls | className prefix | String |

rc-swipeout
| | style | swipeout style | Object | `
|
| left       | swipeout buttons on left      | Array |
[]
|
| right       | swipeout buttons on right      | Array |
[]
|
| autoClose       | auto close on button press   | Boolean |
function() {}
|
| onOpen       |       | Function |
function() {}
|
| onClose       |       | Function |
function() {}
|
| disabled       |   disabled swipeout    | Boolean |
false` |

button props

| name | description | type | default | |-------------|------------------------|--------|------------| | text | button text | String |

Click
| | style | button style | Object |
|
| onPress       | button press function      | Function | `function() {}` |
| className       | button custom class     | String |
|

Test Case

npm test
npm run chrome-test

Coverage

npm run coverage

open coverage/ dir

License

rc-swipeout is released under the MIT license.

We use cookies. If you continue to browse the site, you agree to the use of cookies. For more information on our use of cookies please see our Privacy Policy.