36 lines
1.3 KiB
JavaScript
36 lines
1.3 KiB
JavaScript
/**
|
||
* Button 按钮（规范 §22 / Token §2 主色 + 功能色）
|
||
*
|
||
* 变体 variant：primary（主红）/ secondary（白底红边）/ ghost（无背景）/ danger / text
|
||
* 尺寸 size：sm / md（默认）/ lg
|
||
* 状态：disabled / loading
|
||
* 用法：
|
||
* <ui-button variant="primary" size="md" bindtap="onSubmit">提交</ui-button>
|
||
* <ui-button variant="danger" block loading>删除</ui-button>
|
||
*/
|
||
Component({
|
||
options: { addGlobalClass: true, multipleSlots: true },
|
||
externalClasses: ['custom-class'],
|
||
properties: {
|
||
variant: { type: String, value: 'primary' }, // primary|secondary|ghost|danger|text
|
||
size: { type: String, value: 'md' }, // sm|md|lg
|
||
block: { type: Boolean, value: false }, // 是否撑满父容器
|
||
disabled: { type: Boolean, value: false },
|
||
loading: { type: Boolean, value: false },
|
||
openType: { type: String, value: '' }, // 透传原生 open-type（getPhoneNumber 等）
|
||
hoverClass: { type: String, value: 'ui-btn--hover' },
|
||
},
|
||
methods: {
|
||
onTap(e) {
|
||
if (this.data.disabled || this.data.loading) return;
|
||
this.triggerEvent('tap', e.detail || {});
|
||
},
|
||
onGetPhoneNumber(e) {
|
||
this.triggerEvent('getphonenumber', e.detail || {});
|
||
},
|
||
onError(e) {
|
||
this.triggerEvent('error', e.detail || {});
|
||
},
|
||
},
|
||
});
|