react-native拖动排序列表
react-native-order-flat-list
你可以通过手势上下拖动自由地排序列表
安装npm install react-native-order-flat-list --save 示例
| parameter | type | required | default | description |
|---|---|---|---|---|
| style | oneOfType([number, object, array]) | no | 组件样式 | |
| orderStyle | oneOfType([number, object, array]) | no | 排序样式 | |
| orderWidth | number | no | 44 | 排序按钮宽 |
| icon | number | no | 图标 | |
| iconStyle | oneOfType([number, object, array]) | no | 图标样式 | |
| getListRef | func | no | 获取列表ref | |
| itemHeight | number | yes | 列表项高度 | |
| orderKeyName | string | no | 列表排序字段 | |
| isOrder | bool | no | false | 是否排序 |
| renderFrameTime | number | no | 20 | 渲染帧时间(ms;不建议太大或太小) |
| onOrder | func | yes | 排序 { orderKeys: 排序字段(,分隔;orderKeyName不为空时有值), list: 列表, orderItemKey: 排序项字段(orderKeyName不为空时有值), moveItemKey: 移动项字段(orderKeyName不为空时有值), orderItemIndex: 排序项位置, moveItemIndex: 移动项位置 } |
属性props支持所有FlatList的props
注意你应该依赖props.onOrder({orderKeys, list, orderItemKey, moveItemKey, orderItemIndex, moveItemIndex})的回调参数调整props.data使其发生排序改变并操作你的后端api
你可以选择在即将提交到后端时替换你的data数据使其列表即时发生改变,这样不会有卡顿或迟缓。比如在reducer的REQUESTING_${ACTION_TYPES.ACTION_TYPE}里
https://github.com/thisXY/react-native-order-flat-list
版权声明：
1、该文章(资料)来源于互联网公开信息，我方只是对该内容做点评，所分享的下载地址为原作者公开地址。2、网站不提供资料下载，如需下载请到原作者页面进行下载。
