更新记录
1.0.0(2020-04-22) 下载此版本
2020/4/22/首次发布
目前适配于
- H5
- 微信小程序
平台兼容性
预览

注意
本组件只在微信小程序和H5端测试过,如有问题请指正
使用步骤
引入
import ourGoTop from '@/components/our-gotop/our-gotop.vue'
export default {
components: { ourGoTop }
}
使用
H5端可以这样
<template>
<view>
<view>
<view></view>
<view></view>
<view></view>
<view></view>
</view>
<!-- 在页面里使用,默认为内置图标 -->
<ourGoTop />
</view>
</template>
也可以自定义自己的内容(小程序端只能自定义自己的内容,只能用这种方式)
<template>
<view>
<view>
<view></view>
<view></view>
<view></view>
<view></view>
</view>
<!-- 在页面里使用,用自己定义的内容 -->
<our-go-top>
<view>TOP</view>
</our-go-top>
</view>
</template>
可配置属性
| 参数 | 类型 | 默认值 | 描述 | 注意(没说明的都行) |
|---|---|---|---|---|
| scrollY | Number | 1000 | 控制滚动到距离视口上方多少显示组件,如果设置为0,则永久显示 | 这个属性在H5端才有用,在小程序端组件永久显示 |
| scrollSpeed | Number | 100 | 滚动到上方的速度 | 这个值在H5才有效 |
| duration | Number | 300 | 滚动的动画时间 | 这个值在小程序端才有效 |
| color | String | #333 | 内置图标的颜色 | 这个属性在H5端才有用 |
| right | Number | 30 | 距离视口右边的距离 | |
| bottom | Number | 50 | 距离视口下边的距离 | |
| width | Number | 50 | 图标的宽度 | |
| height | Number | 50 | 图标的高度 | |
| zIndex | Number | 1000 | 层级 |

收藏人数:
https://github.com/0wlism/0wlism-components/blob/master/components/our-gotop/our-gotop.vue
下载插件并导入HBuilderX
赞赏(0)
下载 3373
赞赏 1
下载 11992497
赞赏 1823
赞赏
京公网安备:11010802035340号