小程序悬浮按钮
小程序悬浮按钮
运行
Events
悬浮按钮（Floating Action Button，简称 FAB）是 APP 应用中常见的 UI 元件。它轻盈、优雅、便捷又高效，是 Google 设计语言中一颗璀璨的明珠。悬浮按钮往往都会独立出现在界面之上，提升整体的导航，拓展页面的功能，使应用的操作更加便捷。
基于小程序组件 movable-area、movable-view 封装。
查看效果
克隆仓库，导入到微信开发者工具
安装依赖 npm i
开发者工具中的菜单栏：工具 -> 构建 npm
<floating-button options="{{ options }}" bind:select="onSelect" />
Page({ data: { options: [ { value: 1, label: '选项一' }, { value: 2, label: '选项二' }, ] }, onSelect (e) { console.log(e.detail) } }) API Props
| 参数 | 说明 | 类型 | 默认值 |
|---|---|---|---|
| options | 可选项数据 | array | - |
| openText | 触发按钮开启文字描述 | string | - |
| closeText | 触发按钮关闭文字描述 | string | - |
| x | 定义 x 轴方向的偏移 | number | - |
| y | 定义 y 轴方向的偏移 | number | - |
| zIndex | 元素 z-index | number | 999 |
| 事件名 | 说明 | 回调参数 |
|---|---|---|
| select | 点击选项回调 | 点击项的 value |
版权声明：
1、该文章(资料)来源于互联网公开信息，我方只是对该内容做点评，所分享的下载地址为原作者公开地址。2、网站不提供资料下载，如需下载请到原作者页面进行下载。
