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 || {});
|
|||
|
|
},
|
|||
|
|
},
|
|||
|
|
});
|