react native 关于FlatList滚动事件的坑

最近想实现一个这样的需求,用户将FlatList向上滑动是隐藏顶部导航栏,向下滑动的时候显示顶部导航栏。
我的实现逻辑:首先要实现这个功能,需要知道用户的手势是向上滚动还是向下滚动,拿到实时的坐标信息,那么如何才能得到坐标信息呢?首先想到的就是去查官方的API,然后发现FlatList的文档中没有onScroll事件监听,有点小懵逼。然后想ScrollViewFlatList是父子关系,去看看ScrollView的API说明吧,果然在ScrollView中发现了onScroll的事件监听,文档介绍如下。

react native 关于FlatList滚动事件的坑_第1张图片
image.png

看完后发现并没有关于回调函数的参数介绍,然后试着在回调函数中加了一个 event的参数,打印试试看。
image.png

react native 关于FlatList滚动事件的坑_第2张图片
image.png

image.png

看到打印的信息有是一脸懵逼了,不是我要的信息啊。
然后怎么办了,去翻翻 react nativeIssues吧,然后一顿猛搜,找到了一点线索,还有这种操作?(我感觉颠覆了我的程序观 )
react native 关于FlatList滚动事件的坑_第3张图片
z

拿到这个信息就好实现我的功能了。
以上就是我使用 FlatList中遇到的这个坑,希望能为在react native坑之路上的小伙伴们填一个坑,毕竟还有很多坑等着我们去填,保持乐观的态度最重要 。

你可能感兴趣的:(react native 关于FlatList滚动事件的坑)