Divider 分隔符


分割内容提示符

使用指南

在 Taro 文件中引入组件

  1. import { AtDivider } from 'taro-ui'

组件依赖的样式文件(仅按需引用时需要)

  1. @import "~taro-ui/dist/style/components/divider.scss";
    @import "~taro-ui/dist/style/components/icon.scss";

一般用法

  1. <AtDivider content='分割线' />

自定义颜色

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

自定义内容

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

  1. /* import { AtDivider,AtIcon } from 'taro-ui' */
    <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

Divider分隔符 - 图1