Container · Click
弹层挂载在目标元素内,点击触发。包含一个可销毁的实例。
提示:销毁后可以刷新页面重新创建。
Container · Hover
Hover 触发 + 容器挂载,适合展示气泡式信息。
Body · Hover
弹层挂载在 body,适合全局浮层使用场景。
Body · Click
弹层挂载在 body,点击触发,适合全局弹窗场景。
Container · Click · Offset
容器挂载 + 点击触发,配合偏移量调整弹层位置。
Body · Click · Offset
Body 挂载 + 点击触发,配合偏移量调整弹层位置。
Offset · Hover
偏移量示例:适合让气泡留出可视间距。
Boundary · Container
通过 boundaryContainer 指定边界节点(虚线框):弹层不会溢出该范围,默认为 window 窗口。
定位翻转与最终裁剪都以该虚线框为参考,不再以浏览器视口为准。
API 使用
通过实例属性 / 方法动态控制弹层:new Picker(...) · open · setPlacement() · innerHTML() · disabled · destroy() · onOpenChange。
picker: destroyed
open: false