@aligov/fr-comp-rich
TypeScript icon, indicating that this package has built-in type declarations

2.0.19 • Public • Published

数政dialog

@aligov/components-dialog

数政dialog,基于 Fusion Dialog 做定制,主要是对弹层宽度做了几个尺寸的限制,默认是 medium

API

参数名 说明 必填 类型 默认值 备注
size 大小:'small' or 'medium' or 'large' string medium
hasFooterBorder 底部按钮上方是否有分隔线 boolean false
okClickableDelay 确定按钮可点击的延时,单位秒,整数 number
okRender 确定按钮的渲染函数,主要配合 okClickableDelay 使用 (remainSeconds: number) => ReactElement
className 自定义 class string
style 自定义样式 object

除了上面这些参数外,其他参数沿用 Fusion Dialog 的参数,用法也一致。

关于弹层标题以及底部按钮和主体内容之间的分隔线,组件内部不会主动添加,而是采用主题的设置。

hasFooterBorder 在主题的基础上,默认底部按钮上方分隔线会隐藏掉,只要在设为 true 后才会展示。用于主体内容有分页(如表格 + 分页)的场景。

okClickableDelayokRender 搭配用来实现确定按钮需要等待指定秒数后才能点击的效果。

开发

开发阶段,如果需要在特定主题下看,先安装依赖(不要保存到 package.json 中),然后 bash 下使用 theme=the-pkg npm start 来运行,如 theme=@alifd/theme-dev-test-only npm start

fish 下使用 env theme=the-pkg npm start

Todo

[ ] max height

Readme

Keywords

Package Sidebar

Install

npm i @aligov/fr-comp-rich

Weekly Downloads

1

Version

2.0.19

License

MIT

Unpacked Size

31.8 kB

Total Files

12

Last publish

Collaborators

  • jasoncapricorn
  • qingkaili
  • huguoxin
  • shenyu.wsy
  • liunian
  • tao1991123
  • itrip
  • xiazhiqiang
  • mo.zhou
  • guoliang.hgl
  • daip
  • baizhao