Space 间距
虽然我们拥有 Divider
组件,但很多时候我们需要不是一个被 Divider
组件分割开的页面结构, 因此我们会重复的使用很多的 Divider
组件,这在我们的开发效率上造成了一定的困扰。 间距组件就是为了解决这种困扰应运而生的。
基本用法
最基础的用法,通过这个组件来给组件之间提供统一的间距。
垂直布局
使用 vertical
来控制布局的方式, 背后实际上是利用了 flex-direction
来控制.
控制间距的大小
通过 size
来调整间距大小,默认是 medium
。
自定义 Size
很多时候,内建的大小不满足设计师的要求,我们可以通过传入自己定义的大小 (数值类型) 来设置。
自己定义大小通过调整 gap
的值来控制。
API
Props
属性 | 描述 | 类型 | 可选值 | 默认值 |
---|---|---|---|---|
vertical | 垂直显示 | boolean | - | false |
size | 间距大小 | string | small/medium/large | medium |
gap | 自定义间距大小 | string/number | - | - |