FixedActionBar ​

qxs-fixed-action-bar 是 @qxs-bns/components 里的底部固定操作容器，适合移动端提交区、订单确认栏、表单底部按钮组这类需要始终保留主操作的位置。

基础用法 ​

import '@qxs-bns/components/fixed-action-bar'

如果你已经全量引入：

import '@qxs-bns/components'

使用说明 ​

• qxs-fixed-action-bar 只负责固定容器和占位高度计算，具体按钮、文本和业务信息都由默认插槽传入。
• 推荐使用 qxs-fixed-action-bar::part(actionbar) 自定义背景、圆角、阴影等外观，不要依赖内部 DOM 结构。
• padding 接受数字，组件会同时处理底部安全区，Android 下会自动兜到不小于 20px 的底部留白。

常见场景 ​

宿主接入示例 ​

API ​

属性 ​

插槽 ​

CSS Parts ​

常见问题 ​

为什么文档里的 demo 会直接贴到浏览器底部？ ​

因为这里展示的是组件真实行为，qxs-fixed-action-bar 默认就是 position: fixed。
所以文档页里的多个 demo 也会像业务页面一样直接贴到底部，不再额外做局部预览限制。

为什么推荐用 ::part(actionbar)，而不是只传 class-name？ ​

因为 qxs-fixed-action-bar 使用 Shadow DOM，外部样式不应该依赖内部 DOM 结构。
class-name 主要用于兼容旧版 API，新的样式覆盖方式建议统一走 part。

相关文档 ​

• Components 安装
• Components 总览