@beisen-phoenix/unmodeled-layer
使用 rc-trigger 来实现弹框可见性的控制, 包括动画,定位等信息, 封装 rc-trigger,实现自适应位置
API 属性如下:
成员 | 说明 | 类型 | 默认值 |
---|---|---|---|
visible | 是否显示 | boolean | - |
size | 尺寸大小: small(170px) large(340px) auto(由内容撑开) 不设置默认与 trigger 元素等宽 | string | - |
width | 自定义大小,优先级低于 size | number | - |
childMargin | 子组件的外边距 | string | 0px |
trigger | 触发展示的行为: hover click | string[] | [ 'hover'] |
footer | 自定义按钮 | object | - |
autoAdjust | 是否自适应调整位置 | Boolean | true |
content | 弹窗内容 | ReactNode | - |
onVisibleChange | 弹层显示状态改变时调用(只有在受控模式下会被调用), 参数为 visible | Function(visible) | - |
onOk | 如果你使用弹层默认的footer,footer自带的确定按钮的点击回调函数 | Function | - |
okText | 如果你使用弹层默认的footer,footer自带的确定按钮的文案 | Function | - |
extraCls | 自定义 class | string | "" |
blockContainer | 外层容器的显示类型(true 是 block 类型,false 则是 inline-block) | Boolean | false |
placement | 弹层的显示位置(可选值:topLeft, topRight, bottomRight, bottomLeft) | string | bottomLeft |
builtinPlacements | 弹层的可定义偏移位置(具体可参考 dom-align) | object | -- |
getPopupContainer | 弹层挂载的容器 | Function | - |
destroyPopupOnHide | 隐藏的时候是否销毁节点 | boolean | false |
forceRender | whether render popup before first show | boolean | false |
popupAnimation | https://github.com/react-component/animate | String/Object | slide-up |
mouseLeaveDelay | mouseLeave延迟时间 | number | 0.1 |
mask | 是否显示遮罩 | boolean | false |
maskClosable | 当mask为true时,设置此只有意义,表示是否允许点击遮罩关闭弹层 | boolean | true |
builtinPlacements 取值举例
{
topLeft: {
points: ['bl', 'tl'],
},
topRight: {
points: ['br', 'tr'],
},
bottomRight: {
points: ['tr', 'br'],
},
bottomLeft: {
points: ['tl', 'bl'],
offset: [-11, -15]
},
}