组件功能

Spacer 是弹性空白组件，用于在布局中创建可伸缩的空白区域，帮助子组件在容器中灵活对齐或拉开间距。

基础用法

通过在布局容器中插入 Spacer，它会自动占用父容器的剩余空间，从而控制元素间距或对齐方式。

Template 示例：

<Row>
  <Text value="左侧内容" />
  <Spacer />
  <Button label="右侧按钮" />
</Row>

效果展示如下：

属性说明

工作原理

Spacer 组件会自动填充其父容器中的剩余空间：

• 在 Row 容器中，会填充水平方向的空白。

• 在 Col 容器中，会填充垂直方向的空白。

使用场景

1. 将按钮推到右侧。

   Template 示例：

   <Row>
     <Title value="标题" />
     <Spacer />
     <Button label="操作" />
   </Row>
   

   效果示例如下：

   

2. 垂直居中对齐。

   Template 示例：

   <Col height="400px">
     <Spacer />
     <Text value="居中内容" />
     <Spacer />
   </Col>
   

   效果示例如下：