scroll-view是否触底问题

众城世家聊天页面中，要实现微信那种，如果有新消息，在底部的话就滚动到新消息，如果没有在底部的话就不滚动，这个时候需要判断是否在底部，经uview开发人员帮助，进行尝试。

第一次尝试

给scroll-view加scroll和scrolltolower事件，如果触发scroll事件的话就设置不触底，如果触发scrolltolower事件的话就触底，这个时候发现触底以后还是会触发scroll事件的，这种方案不行。

第二次尝试

在第一次尝试的基础上，我们给scrolltolower事件一个延迟，也就是触发scrolltolower事件以后100ms后再设置触底，这个时候短距离滚动，还是会偶尔触发scrolltolower事件，这种方案也不行。

第三次尝试

在第二次的基础上，我们设置很小的触底距离lower-threshold，设置为5，这个时候基本触底判断就很准确了，但是，这个时候有出现个意外的情况，第一次进来的时候我们会让页面滚动到底部，this.scrollTop = 9999，但是这个滚动会触发scroll事件，但是并不会触发scrolltolower事件，这种方案也不完美。

第四次尝试

在第三次的基础上，我们在第一次进来的时候，页面渲染完以后设置已触底，这个时候发现就算最后设置已触底，触底状态还是不触底，失败。

第五次尝试

我们在页面渲染完成以后，延迟100ms，这个时候发现触底判断就正确了。到此结束

总结

1. 设置scroll和scrolltolower事件，并设置lower-threshold小一点，建议设置为5
2. scroll事件触发以后设置不触底，scrolltolower事件触发以后，延迟100ms设置触底
3. 第一次进来页面以后，当页面渲染完成以后，延迟100ms设置触底

留言

点击留言