qrcode
扫描二维码查看 H5 演示效果
qrcode
扫描二维码查看演示效果
taro-ui, 非 taro-ui-vue3
wxapp

Divider 分隔符

分割内容提示符

使用指南

在 Taro 文件中引入组件

import { AtDivider } from 'taro-ui-vue3'

组件依赖的样式文件（仅按需引用时需要）

@import "taro-ui-vue3/dist/style/components/divider.scss";

一般用法

<AtDivider content='分割线' />

自定义颜色

<AtDivider content='没有更多了' fontColor='#ed3f14' lineColor='#ed3f14' />
<AtDivider content='没有更多了' fontColor='#ff9900' lineColor='#ff9900' />
<AtDivider content='没有更多了' fontColor='#2d8cf0' lineColor='#2d8cf0' />

自定义内容

说明：只有当 content 为空时，才能嵌套子组件

<AtDivider>
  <AtIcon value='check-circle'></AtIcon>
</AtDivider>

参数

参数说明类型可选值默认值
content分隔符文字String--
height分隔符高度，会自动转 rem,rpxString or Number-112
fontColor文字颜色String-#6190E8
fontSize文字大小，会自动转 rem,rpxString or Number-32
lineColor分割线颜色String-#CCC