0
点赞
收藏
分享

微信扫一扫

Vue——Uniapp回到顶部悬浮按钮

梦幻之云 2024-10-14 阅读 18

代码示例

<template>
  <view class="updata" @click="handleup" :style="{bottom: bottomType+'px'}" >
    <i class="iconfont icon-huidaodingbu"></i>
  </view>
</template>

<script>
export default {
  name: "backTop",
props: {
  bottomType: {
    type: Number,
    default: 140,
    required: false
  }
  },
  mounted(){
  }
  ,
  methods:{
    handleup() {
      uni.pageScrollTo({
        scrollTop: 0
      })
    },
  }
}
</script>

<style lang="scss">
// 回到顶部
.updata {
  position: fixed;
  right:5px;
  bottom: 140px;
  z-index: 99;
i {
  color: rgba(5, 142, 187, 0.6);
  font-size: 40px;
}
}
</style>

其他页面引用

 <back-top :bottom-type="60" ></back-top>
举报

相关推荐

0 条评论