@rax-ui/modal NPM | npm.io

1.0.0-beta.62 • Published 3 years ago

Install

Weekly downloads

53

License

-

Repository

Last release

3 years ago

display: Modal

family: utils

Modal

Modal 提供了弹出遮罩层的能力，为 Dialog、Drawer 等组件提供了底层能力。 (Weex, Web)

API

Props

名称	说明	类型	默认值
visible	对话框是否显示	boolean	false
container	对话框的容器		() => document.body
disablePortal	禁用 `portal` 功能	boolean	false
keepMounted	是否一直存在	boolean	false
hideBackdrop	是否隐藏遮盖背景	boolean	false
disableBackdropClose	是否禁用背景点击关闭	boolean	false
onEnter	开始进入时回调函数	() => void
onExit	开始退出时回调函数	() => void
onEntering	正在进入时回调函数	() => void
onExiting	正在退出时回调函数	() => void
onEntered	进入后回调函数	() => void
onExited	退出后回调函数	() => void
onBackdropClick	遮盖背景被点击时调用	() => void
onClose	关闭时调用	(reason: string) => void
transition	打开/关闭的过渡动效	{ transition: TransitonType, styles: { enter, exit } }
containerStyle	容器样式，设置 transition 后生效	CSSProperties

TransitionType

名称	说明	类型	默认值
properties	过渡属性	Array	[]
delay	延迟时间	number	0
duration	动画持续时间	number
timingFunction	动画函数	'linear' / 'ease' / 'ease-in' / 'ease-out' / 'ease-in-out' / 'cubic-bezier(x1, y1, x2, y2)'	'ease'

CSS API

名称	说明
modal	对话框样式
backdrop	背景样式

Rax rax-component

@rax-ui/styles @rax-ui/transition rax-clone-element rax-create-portal rax-find-dom-node rax-is-valid-element rax-text rax-view universal-env

@infinitebrahmanuniverse/nolb-_rax @everything-registry/sub-chunk-760 @rax-ui/dialog @rax-ui/drawer @zalastax/nolb-_rax

3 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago