Appearance
引入组件
局部引入
ts
// parent.vue
const FBottomArea = defineAsyncComponent(() => import('@/components/formaui/f-bottom-area/f-bottom-area.vue'))基础用法
html
<f-bottom-area bg-color="#fff" @init="initBottom">
<view class="h-[80rpx] flex items-center justify-center">footer</view>
</f-bottom-area>
<f-bottom-area :is-fixed="false" bg-color="#fff"></f-bottom-area>ts
const initBottom = (e: { height: number }) => {
uni.showToast({ title: e.height + 'px', icon: 'none' })
}插槽
| 名称 | 说明 |
|---|---|
| default | 显示内容 |
属性
| 名称 | 类型 | 说明 | 默认值 |
|---|---|---|---|
isFixed | boolean | 是否固定在底部 | true |
bgColor | string | 自定义背景颜色 | --f-page-color |
事件
| 事件名 | 说明 | 回调参数 |
|---|---|---|
init | 初始化完成事件 | {height:number} |
