Heading板块标题组件

heading组件用来创建板块的标题,可用在页面的大板块中间,也可用在侧边栏的小版块中间,用来分隔上下板块,并表明本板块的主要内容。

前言

给页面的板块使用标题是常见的操作,使用本组件可以快速创建标题,保持良好的样式效果。

简单使用

ax-heading标签加上label属性即表示一个板块标题。

  • 输出
  • HTML
  • 中国,是以华夏文明为源泉、中华文化为基础,并以汉族为主体民族的多民族国家,通用汉语、汉字,汉族与少数民族被统称为“中华民族”,又自称为炎黄子孙、龙的传人。

  •                 
                    
                

使用图标

icon属性表示使用图标,可填写任意有效的图标类名。

  • 输出
  • HTML
  • 中国,是以华夏文明为源泉、中华文化为基础,并以汉族为主体民族的多民族国家,通用汉语、汉字,汉族与少数民族被统称为“中华民族”,又自称为炎黄子孙、龙的传人。

  •                 
                    
                

使用图片

图片的属性有diskcubeimage,其中disk是圆形图片,cube是方形图片,image是仅限高度的任意图片。

属性值填写图片地址。

icon、disk、cube、image他们四个属性是互斥的,请使用一个即可。

  • 输出
  • HTML
  • 中国,是以华夏文明为源泉、中华文化为基础,并以汉族为主体民族的多民族国家,通用汉语、汉字,汉族与少数民族被统称为“中华民族”,又自称为炎黄子孙、龙的传人。

  •                 
                    
                

使用指示箭头

使用arrow属性表示开启指示箭头,默认是指向右侧的箭头;如果需要自定义箭头图标,可对arrow填写有效的图标类名。

  • 输出
  • HTML
  • 中国,是以华夏文明为源泉、中华文化为基础,并以汉族为主体民族的多民族国家,通用汉语、汉字,汉族与少数民族被统称为“中华民族”,又自称为炎黄子孙、龙的传人。

  •                 
                    
                

使用tips

属性tips作为辅助内容添加在尾部,可以是任意文本,不要喧宾夺主便可。

  • 输出
  • HTML
  • 中国,是以华夏文明为源泉、中华文化为基础,并以汉族为主体民族的多民族国家,通用汉语、汉字,汉族与少数民族被统称为“中华民族”,又自称为炎黄子孙、龙的传人。

  •                 
                    
                

主题风格

属性theme可设置标题风格,可选值有primsuccwarnerrorissueinfotext

  • 输出
  • HTML
  •                 
                    
                

Attributes属性

名称 语义类型 可选值 默认值(运行时) 说明
icon string '' '' 图标类名
disk string '' '' 圆形图片地址
cube string '' '' 方形图片地址
image string '' '' 普通图片地址
arrow string/boolean - false 是否启用指示箭头
label string '' '' 主标题文本
tips string '' '' 辅助提示文本
theme string 'prim'/'error'/'succ'/'info'/'issue'/'warn'/'text' '' 主题风格

Methods方法

有组件通用的内置方法:

  • set:设置组件属性,支持一个参数即被设置的属性值键值对{key,value}或其数组
  • reset:重置组件属性,无参数
  • clear:清除属性和值,无参数

基本用法:CompElem.reset();

Events事件

有组件通用的事件:

  • connected:组件连接成功,无参数
  • disconnected:组件断开连接,无参数
  • adopted:组件被转移,无参数
  • set:设置了属性,支持一个参数即设置的值
  • cleared:清除了属性,无参数
  • reset:重置了属性,无参数

基本用法:CompElem.on('connected',()=>{console.log('connected')});