jk's notes
  • FloatingBubble 浮动气泡

FloatingBubble 浮动气泡

文档: https://vant-contrib.gitee.io/vant/#/zh-CN/floating-bubble

一个脱离文档流的按钮, 在页面的两侧停靠(吸附).

基本用法:

<van-floating-bubble icon="..." @click="..."></van-floating-bubble>

说明:

  • 使用 icon 属性 (字符串) 来设置吸附气泡 图标.
  • 点击后触发 click 事件.
  • 设置 axis="xy" 表示允许在 x 和 y 轴方向拖拽.
  • magnetic="x" 表示吸附到 x 轴最近的一边.
  • v-model:offset 来对 xy 轴进行绑定. 绑定数据类型为 {x:number, y: number}

image-20240114024250275

Last Updated:
Contributors: jk