Space 间距组件

SPSpace 组件用于设置组件之间的间距，支持水平和垂直布局，提供灵活的间距控制方案。

基础用法

最简单的用法，默认为水平布局，小间距。

垂直布局

设置 direction="vertical" 可以让子元素垂直排列。

不同尺寸

内置 small、default、large 三种尺寸，也可以使用数字自定义间距。

自动换行

设置 wrap 属性可以让子元素在空间不足时自动换行。

对齐方式

通过 alignment 属性设置子元素的对齐方式。

分隔符

通过 spacer 属性可以设置子元素之间的分隔符。

填充容器

设置 fill 属性可以让子元素平均分配容器宽度。

混合内容

SPSpace 可以包含任意类型的子元素。

API

Props

暂无数据

Slots

暂无数据

特性说明

间距大小

• small: 8px 间距
• default: 16px 间距
• large: 24px 间距
• 数字值: 自定义间距（单位：px）

对齐方式

• start: 起始对齐（顶部/左侧）
• center: 居中对齐（默认）
• end: 结束对齐（底部/右侧）
• baseline: 基线对齐

使用场景

1. 按钮组合: 多个按钮的水平或垂直排列
2. 表单布局: 表单元素之间的间距控制
3. 卡片排列: 卡片列表的间距管理
4. 导航菜单: 导航项之间的分隔
5. 标签组: 标签列表的布局控制

注意事项

1. 性能优化: Space 组件会自动过滤空的子节点，确保间距的准确性
2. 响应式: 结合 CSS 媒体查询可以实现响应式间距
3. 嵌套使用: 支持多层嵌套，可以创建复杂的布局结构
4. 自定义样式: 可以通过 CSS 变量或类名进行样式定制