Affix
Affix 吸顶/底容器
代码示例
import { BfAffix, BfButton } from '@bud-fe/react-taro-ui';import React from 'react';import styles from './index.module.less';export default () => {return (<><BfAffix mode="doubleBtn" confirmText="OK" /><BfAffix position="top" className={styles['four-btn-container']}><BfButton type="primary">按钮1</BfButton><BfButton type="default" plain>按钮2</BfButton><BfButton type="primary">按钮3</BfButton><BfButton type="primary" plain>按钮4</BfButton></BfAffix></>);};
API
属性名 | 描述 | 类型 | 默认值 |
---|---|---|---|
children | 自定义内容。 | any | -- |
layout | 布局设置 | "left" | "center" | "right" | "space-between" | "space-around" | center |
postion | 固定位置。为 bottom 时,会在文档流中加入一个占位的元素 @deprecated - use position instead | "top" | "bottom" | bottom |
position | 固定位置。为 bottom 时,会在文档流中加入一个占位的元素 | "top" | "bottom" | bottom |
mode | 模式。默认为空内容 | "singleBtn" | "doubleBtn" | -- |
cancelText | 自定义取消按钮文本 | string | 取消 |
confirmText | 自定义确认按钮文本 | string | 确定 |
confirmDisable | 确认按钮是否禁用 | boolean | false |
cancelDisable | 取消按钮是否禁用 | boolean | false |
safeAreaInsetBottom | 是否开启底部安全区适配。当 position 为 bottom 时为 true | boolean | 当 position 为 bottom 时为 true |
removePlaceholder | 是否移除占位元素(吸底时) | boolean | false |
transparent | 背景是否透明。默认白底 | boolean | false |
onCancel | 回调: 取消 | () => void | -- |
onConfirm | 回调: 确认 | () => void | -- |