应用场景 在uniapp中文章页或者长列表页实现返回顶部的效果。 实现代码
<template> <view class="news_detail_container"> <view class='back_btn' v-show="showBack" @tap="handleTop"> <img class="back_icon" src="../../static//icons/top.png" alt=""> </view> </view> </template> <script> export default { data() { return { showBack: false } }, methods: { handleTop() { uni.pageScrollTo({ scrollTop: 0, duration: 300 }); }, }, // 页面滚动距离超过100才显示返回顶部的按钮 onPageScroll(e){ this.showBack=e.scrollTop>100 } } </script> <style> .back_icon { width: 68rpx; height: 68rpx; } .back_btn{ position: fixed; bottom: 200rpx; right: 30rpx; } </style>
标签:返回,uniapp,顶部,showBack,back,68rpx From: https://www.cnblogs.com/nicoz/p/18081060