效果图：

 

一、可以利用uniapp提供的scroll-view 并且允许纵向滚动

https://uniapp.dcloud.io/component/scroll-view.html#scroll-view

 首先需要把你写的内容用scroll-view包起来

注意：  这几个属性

<template>
	<scroll-view :scroll-into-view="topItem"
        scroll-with-animation scroll-y="true" 
        class="scroll-cont" 
        @scroll="handleScroll"
    >
        <view class="home">
            //比如我想返回至这个位置(位置自己定)那么只需要写一个空的标签(记得带id名字)
            <view id="top"></view>
                

		    //你的内容~~~~~
		    //你的内容~~~~~
                
            //这个是你要点击的按钮
            <view class="back-top" v-if="isShow" @click="handleBackTop">
				<text class="iconfont icon-fanhuidingbu fs-30"></text>
			</view>
        </view>
	</scroll-view>
</template>

<script>
    data() {
			return {
				// 返回的按钮是否显示
				isShow:false,
				topItem:'' //返回顶部的标记点
			};
		},
		methods:{
			handleScroll(e){
                //只有scrollTop有用，先拿scrollTop
				let {scrollTop} = e.detail
                //滑动大于500让按钮显示
				this.isShow = scrollTop>500
                //因为点第二次不行，这里记得重置清空一下
				this.topItem = ''
			},
			handleBackTop(){
				this.topItem = 'top'
			}
		}
</script>

<style lang="scss">
    .scroll-cont{
		height: 100vh;
	}
   .back-top {
		height: 100rpx;
		width: 100rpx;
		background-color: #fff;
		border-radius: 50%;
		box-shadow: 0 0 10rpx 4rpx rgba(0, 0, 0, .4);
		position: fixed;
		bottom: 40rpx;
		right: 20rpx;
		text-align: center;
		line-height: 100rpx;
	}
</style>

二、也可以用uni.pageScrollTo({})

https://uniapp.dcloud.io/api/ui/scroll.html#pagescrollto

 因为这个返回顶部可能在多个地方使用，所以建议封装。

首先在components里新建一个组件(名字自己起)

我这里叫view-top.vue  代码如下：

<template>
	<view>
		<view class="top" v-if="topShow" @click="goTop()">
			<cl-icon name="cl-icon-top" :size="30"></cl-icon>
		</view>
	</view>
</template>

<script>
	export default {
		name:"viewTop",
		data() {
			return {
				topShow: false,
			};
		},
		props: {
			scrollTop: {
				type: Number,
				default: 0
			},
		},
		
		methods:{
			topData(e){
                 //这个e直接是滚动时候的高度
				this.topShow = e>600
			},
			goTop(){
				uni.pageScrollTo({
					scrollTop: this.scrollTop,
					duration: 300
				});
			},
		}
	}
</script>

<style lang="scss">
	.top {
		height: 80rpx;
		width: 80rpx;
		text-align: center;
		line-height: 80rpx;
		border-radius: 50%;
		background-color: rgba($color: #FFFFFF, $alpha: 0.8);
		border: 1rpx solid #ddd;
		position: fixed;
		z-index: 999;
		right: 30rpx;
		bottom: 100rpx;
		animation: heart 0.3s;
		@keyframes heart {
			0% {
				right: -30rpx;
			}
			100% {
				right: 30rpx;
			}
		}
	}
</style>

那我要在Home页面使用的话

<template>	
	<viewTop ref="VT" :scrollTop="top"></viewTop>
</template>

<script>
	import viewTop from "@/components/view-top";
    export default {
		components: {
			viewTop
		},
        data() {
			return {
                //距离顶部距离
				top:0,
			};
		},
        onPageScroll(e) {
			 //调用子组件方法
			this.$refs.VT.topData(e.scrollTop);
		},
    }
</script>