Yy Craft

主题

Divider 分割线 ​

基本用法 ​

查看示例
vue
<template>
  <yy-divider />
</template>

带内容的分割线 ​

查看示例
vue
<template>
  <yy-divider>内容</yy-divider>
</template>

内容位置 ​

查看示例
vue
<template>
  <yy-divider content-position="left">
    左侧
  </yy-divider>
  <yy-divider content-position="center">
    居中
  </yy-divider>
  <yy-divider content-position="right">
    右侧
  </yy-divider>
</template>

虚线分割线 ​

查看示例
vue
<template>
  <yy-divider border-style="dashed">
    Dashed
  </yy-divider>
  <yy-divider border-style="dotted">
    Dotted
  </yy-divider>
</template>

垂直分割线 ​

查看示例
vue
<template>
  <yy-divider vertical />
</template>

Props ​

参数说明类型默认值
borderStyle分割线样式'none' | 'hidden' | 'dotted' | 'dashed' | 'solid' | 'double' | 'groove' | 'ridge' | 'inset' | 'outset'-
contentPosition内容位置'left' | 'right' | 'center''center'
vertical是否垂直booleanfalse