效果图：

一、可以利用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>