layui/example/docs/zh-CN/components/backtop.md

::: title 基础使用

回到顶部组件的默认样式，通过滑动来查看页面右下角的按钮。

::: ::: demo

:::

:::title 自定义

回到顶部组件可自定义样式，限制宽高：50px * 50px，showHeight = 0 将始终显示，disabled 属性可以禁用返回顶部效果。查看页面右下角的圆形按钮。

::: demo

:::

::: title 滚动容器

通过设置 target 和 position="absolute"参数 ，可对特定容器进行返回顶部操作

::: ::: demo

{{index + ".  layui-vue , 基 于 vue 3.0 的 桌 面 端 组 件 库 , layui 的 另 一 种 呈 现 方 式"}}

:::

::: title 结合 tooltip 组件使用

可以和 lay-tooltip 组件搭配使用

::: ::: demo

{{index + ".  layui-vue , 基 于 vue 3.0 的 桌 面 端 组 件 库 , layui 的 另 一 种 呈 现 方 式"}}

:::

::: title 属性 :::

::: table

属性	说明	类型	可选值
target	可选，触发滚动的对象	string	元素选择器 | window(默认)
showHeight	可选，滚动高度达到该值后显示回到顶部按钮	number	200(默认)
position	可选，定位方式，特定容器内部需设置为 absolute	string	absolute | fixed(默认)
right	可选，按钮距离页面右边距，单位 px	number	30(默认)
bottom	可选，按钮距离页面底部位置，单位 px	number	40(默认)
bgcolor	可选，背景颜色	string	#9F9F9F(默认)
disabled	可选，禁用点击返回顶部	boolean	true | false(默认)

:::

::: title 事件 :::

::: table

事件名	说明	回调参数
click	点击回到顶部按钮的回调函数	event

:::

::: title 插槽 :::

::: table

插槽名	说明
—	自定义内容

:::