主题
Footer 页脚
在页面底部显示导航链接和辅助文本,可固定定位并适配底部安全区。
支持平台
以下为官网文档所列的平台支持情况,具体功能及版本限制请参见本页的平台说明。
| App-vue | App-nvue | 微信小程序 | 支付宝小程序 | 百度小程序 | 字节小程序 | QQ小程序 | H5 | PC | 快手小程序 | 钉钉小程序 |
|---|---|---|---|---|---|---|---|---|---|---|
| ✓ | ✓ | ✓ | ✓ | ✓ | ✓ | ✓ | ✓ | ✓ | ✓ | ✓ |
基础用法
vue
<!-- 页脚文本 -->
<fui-footer text="页面底部"></fui-footer>属性
| 属性 | 类型 | 说明 | 官网默认值 |
|---|---|---|---|
| navigate | Array | 导航项列表,可设置 text、url、openType、delta、color、size | [] |
| text | String | 底部显示的文本 | 空字符串 |
| color | String | 底部文本颜色 | #B2B2B2 |
| size | Number、String | 底部文本字号,单位 rpx | 24 |
| background | String | 页脚背景 | transparent |
| borderColor | String | 链接之间的分隔线颜色,源码注明仅 nvue 生效 | #B2B2B2 |
| isFixed | Boolean | 是否固定在页面底部 | false |
| bottom | Number、String | 底部定位偏移量,单位 rpx;官网标注 V2.4.0 起支持 | 0 |
| safeArea | Boolean | 是否处理底部安全区域 | true |
事件
| 事件 | 说明 | 回调参数 |
|---|---|---|
| — | 无自定义事件 | — |
组件使用原生导航元素处理 navigate 列表。
版本及平台说明
官网将 bottom 标注为 V2.4.0 起支持;当前本地文件中也声明并使用了该属性。非 nvue 平台的分隔线样式请参考组件样式和主题变量。
插槽
| 插槽 | 说明 |
|---|---|
| — | 官网未列出该组件的插槽 |