npm install react-native-list-sort
NOTE:
This package uses react-native-reanimated (version 2) and react-native-gesture-handler.
In case you do not have these pacakges installed please see and follow the Softare-Mansion docs:
react-native-reanimated
react-native-gesture-handler
import List from 'react-native-list-sort';
return (
<List
items={originalList}
renderItem={renderItem}
itemHeight={ITEM_HEIGHT} // <----- MUST MATCH THE ITEM'S STYLE HEIGHT
onOrderChange={onOrderChange}
/>
);
Property | Type | Required | Default |
---|---|---|---|
items | Array | yes | - |
renderItem | () => JSX.Element | yes | - |
itemHeight | Number | yes | - |
onOrderChange | (sortedList: Array) => void | yes | - |
dragableAreaSize | number | no | itemHeight |
style | style | no | - |
contentContainerStyle | style | no | - |
* dragableAreaSize enables the capability to make only part of the item draggable (default to the left part of item)
William Candillon - Chrome Drag-to-Sort - “Can it be done in React Native?” - season 4
This project is licensed under the MIT License