Divider分隔线组件
divider分隔线组件有hr标签和ax-line组件相似的效果,即都可以创建一条水平分隔线;我们将divider分隔线定义得更纯粹,他仅仅是分隔上下文,他是上下文的一部分,他的label文本字号和上下文间距都继承自父层。
简单使用
内容中插入ax-divider
标签即可表示一条水平直线。效果同标签<hr>
或<ax-line></ax-line>
。
- 输出
- HTML
-
中国是世界四大文明古国之一,有着悠久的历史,距今约5000年前,以中原地区为中心开始出现聚落组织进而形成国家,后历经多次民族交融和朝代更迭,直至形成多民族国家的大一统局面。
20世纪初辛亥革命后,君主政体退出历史舞台,共和政体建立。1949年中华人民共和国成立后,在中国大陆建立了人民代表大会制度的政体。
-
使用label
如果需要给水平线插入文本,可使用label
属性或者将文本直接写在标签内。divider
标签内的文本与上下文同属正文部分,字号大小继承自父元素。
- 输出
- HTML
-
中国是世界四大文明古国之一,有着悠久的历史,距今约5000年前,以中原地区为中心开始出现聚落组织进而形成国家,后历经多次民族交融和朝代更迭,直至形成多民族国家的大一统局面。
分隔线 20世纪初辛亥革命后,君主政体退出历史舞台,共和政体建立。1949年中华人民共和国成立后,在中国大陆建立了人民代表大会制度的政体。
中国是世界四大文明古国之一,有着悠久的历史,距今约5000年前,以中原地区为中心开始出现聚落组织进而形成国家,后历经多次民族交融和朝代更迭,直至形成多民族国家的大一统局面。
分隔线 20世纪初辛亥革命后,君主政体退出历史舞台,共和政体建立。1949年中华人民共和国成立后,在中国大陆建立了人民代表大会制度的政体。
-
Attributes属性
ax-avatar为自定义标签,其包含的属性如下:
名称 | 可选值 | 默认值 | 说明 |
---|---|---|---|
label | ''/-- | '' | 文本 |
break | 'xxs'/'xs'/'sm'/'md'/'lg'/'xl'/'xxl'/ | 'sm' | 上下的间距 |
fs | ''/- | '' | 文本的字号 |
size | 'sm'/'md'/'lg' | 'sm' | label的字号 |
Methods方法
有组件通用的内置方法:
- set:设置组件属性,支持一个参数即被设置的属性值键值对
{key,value}
或其数组 - reset:重置组件属性,无参数
- clear:清除属性和值,无参数
基本用法:CompElem.reset();
Events事件
有组件通用的事件:
- connected:组件连接成功,无参数
- disconnected:组件断开连接,无参数
- adopted:组件被转移,无参数
- set:设置了属性,支持一个参数即设置的值
- cleared:清除了属性,无参数
- reset:重置了属性,无参数
基本用法:CompElem.on('connected',()=>{console.log('connected')});