React Native新组件之SwipeableFlatList
2023-09-27 14:22:50 时间
做过移动开发的同学都应该清楚,侧滑删除是移动开发中的一个常见功能。在官方没提供侧滑组件之前,要实现侧滑效果需要使用第三方库,如react-native-swipe-list-view。不过随着React Native 0.50版本的发布,系统新添加SwipeableFlatList组件,SwipeableFlatList是在FlatList基础上实现的侧滑显示菜单的功能,大大的方便了开发。
SwipeableFlatList支持FlatList的所有的属性和方法,另外它还有三个自己的属性,在使用SwipeableFlatList实现侧滑效果时需要处理这三个属性。
- bounceFirstRowOnMount: bool 是一个bool属性,默认是YES,表示第一次是否先滑一下FlatList的Item;
- maxSwipeDistance: number 或者 func, 必须要赋值,表示向左滑动的最大距离
- renderQuickActions:func,必须要赋值,表示滑动显示的内容。
下面让我们实现一个简单的侧滑删除的实例,其效果如下:
相关文章
- react-native 开发优秀开源组件收藏
- React Native组件生命周期
- 自定义react数据验证组件
- 从零学React Native之08Image组件
- react-函数组件的性能优化突破口
- react:组件之间的组合
- WebSupergoo 11.310 C#PDF库组件 WebSuper
- TS装饰器bindThis优雅实现React类组件中this绑定
- How to Achieve Reusability with React Components - 如何实现 React 组件的可复用性 Back
- 开发自己的react-native组件并发布到npm
- React Native - 组件的引用详解(附:setNativeProps、measure方法介绍)
- react-native-smart-barcode目前最好用的二维码扫描组件(IOS、android)
- 关于React-native里Android原生模块和组件的写法
- React native全局变量的使用(跨组件的通信)
- react native测量组件的宽高
- React Native常用一些组件
- React-Native学习之第三方开源组件--侧滑栏----react-native-side-menu
- React-Native学习--轮播图第三方组件-react-native-swiper
- 《React-Native系列》组件封装之Dialog(iOS和Android通用)
- 《React-Native系列》RN组件之Text和TextInput以及注意要点
- React Native 图片组件的一些常见问题汇总