Deform形变按钮组件
deform形变按钮组件可以实现一个按钮切换多种表达形式,比如可以从menu菜单切变为close关闭按钮;支持info、menu、add、close、left、right、up、down、menuLeft、menuRight表单形式;支持多种主题风格。
常规变形按钮
框架定义了四种类型变形按钮,分别是info
,menu
,add
,close
,left
,right
,up
,down
,menuLeft
,menuRight
。常规变形按钮宽高38px(3.8rem),图标型按钮。必须通过type
属性定义按钮类型。
- 输出
- HTML
Attributes属性
名称 | 可选值 | 默认值 | 说明 |
---|---|---|---|
type | 'info'/'menu'/'add'/'close'/'left'/'right'/'up'/'down'/'menuLeft'/'menuRight' | - | 图标类型 |
theme | 'prim'/'succ'/'error'/'warn'/'info'/'issue'/'text'/'brief'/'ignore' | - | 主体风格 |
size | 'sm'/'md'/'lg'/''/- | - | 尺寸大小 |
filled | ''/- | - | 是否实心填充 |
bordered | ''/- | - | 是否使用边框 |
shape | 'square'/'radius'/'round' | 'radius' | 外轮廓造型 |
disabled | ''/- | - | 是否禁止操作 |
Methods方法
有组件通用的内置方法:
- set:设置组件属性,支持一个参数即被设置的属性值键值对
{key,value}
或其数组 - reset:重置组件属性,无参数
- clear:清除属性和值,无参数
基本用法:CompElem.reset();
Events事件
有组件通用的事件:
- connected:组件连接成功,无参数
- disconnected:组件断开连接,无参数
- adopted:组件被转移,无参数
- set:设置了属性,支持一个参数即设置的值
- cleared:清除了属性,无参数
- reset:重置了属性,无参数
基本用法:CompElem.on('connected',()=>{console.log('connected')});