在项目过程中我们会遇到这种情况：
返回标和背景颜色重合导致无法看见的情况，这里有一个简单的方法可以实现
监听页面向下滑动的api：
onPageScroll : function(e) { //nvue暂不支持滚动监听，可用bindingx代替
console.log("滚动距离为：" + e.scrollTop);
},
这个api会实时监听你鼠标向下滚动的距离，直接写在vue2：methods中即可。vue3直接写在setup函数中就可以了如图所示：
步骤
1、先在data中定义数据taranY
2、在方法onPageScroll获取监控的距离
3、在html中通过三目运算符，通过判断taranY的值是大于40（因为下滑距离大于40时刚好与背景颜色重合），从而改变颜色
来看看运行效果：文章来源：https://www.toymoban.com/news/detail-813707.html
文章来源地址https://www.toymoban.com/news/detail-813707.html
到了这里，关于uniapp：如何将返回标根据下滑的距离而改变颜色的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！
