Skip to content

Space

演示

Space 跨端示例与演示

订单筛选标签自动换行,操作纵向填充

当前筛选:全部

基础用法

vue
<template>
  <VSpace>
    <VButton size="sm">按钮</VButton>
    <VButton size="sm">按钮</VButton>
  </VSpace>
</template>

方向与尺寸

vue
<template>
  <VSpace direction="vertical" :size="[8, 12]">
    <VButton size="sm">按钮</VButton>
    <VButton size="sm">按钮</VButton>
  </VSpace>
</template>

换行与填充

vue
<template>
  <VSpace :size="8" wrap>
    <VButton size="sm">按钮</VButton>
    <VButton size="sm">按钮</VButton>
    <VButton size="sm">按钮</VButton>
  </VSpace>
</template>

Props

Prop类型默认值描述
direction'horizontal' | 'vertical''horizontal'间距方向
sizenumber | string | [number | string, number | string]undefined间距尺寸
align'start' | 'end' | 'center' | 'baseline' | 'stretch''start'交叉轴对齐
justify'start' | 'end' | 'center' | 'space-around' | 'space-between' | 'space-evenly''start'主轴对齐
wrapbooleanfalse是否换行
fillbooleanfalse子元素是否填满宽度

Slots

Slot描述
default间距内容