# 返回顶部

## 介绍

返回页面顶部的操作按钮 （不适用于 `scroll-view`）

## 代码演示

### 引入组件

```json
{
  "usingComponents": {
    "free-backtop": "/components/backtop/index"
  }
}
```

### 基础用法

```html
<free-backtop show="{{ isShow }}" />
```

在 `Page` 页面添加`onPageScroll`事件，滑动页面时，动态显示隐藏返回按钮

```js
onPageScroll(e: WechatMiniprogram.ScrollOffsetCallbackResult) {
  if (e.scrollTop > 200) {
    this.setData({ isShow: true });
  } else {
    this.setData({ isShow: false});
  }
}
```

## API

### Props

| 参数     | 说明                             | 类型      | 默认值 |
| -------- | -------------------------------- | --------- | ------ |
| duration | 滚动动画的时长，单位 ms          | 'number'  | `300`  |
| show     | 显示返回顶部按钮                 | `boolean` | `true` |
| right    | 控制其显示位置, 距离页面右边距   | `number`  | `10`   |
| bottom   | 控制其显示位置, 距离页面底部距离 | `number`  | `120`  |
| zIndex   | 控制其元素显示的层级数           | `number`  | `100`  |