Button 按钮

用于开始一个即时操作

何时使用

标记了一个(或封装一组)操作命令,响应用户点击行为,触发相应的业务逻辑

代码示例

基本使用

内联按钮

自定义Icon

辅助按钮

属性

属性类型必填默认值说明
publicIdstring-生活号 id,必须是当前小程序同主体且已关联的生活号,open-type="lifestyle" 时有效。
openTypestring-开放能力。
scopestring-当 openType 为 getAuthorize 时有效。
type'default' | 'primary' | 'warn' | 'danger' | 'success' | 'light''default'按钮类型 default=辅助按钮
primary=品牌色按钮
warn=警示按钮
danger=危险按钮
success=成功按钮
light=弱按钮
fill'outline' | 'solid' | 'none''solid'填充样式
disabledbooleanfalse是否禁用
activeClassNamestring-按下时的类名
subTextstring-辅助文字,显示在第二行
inlinebooleanfalse内联,不撑满父级宽度
inlineSize'small' | 'medium' | 'large' | 'x-large''medium'内联尺寸
iconstring-按钮左侧图标
loadingbooleanfalse是否加载中,加载中时不可点击
loadingTextstring-加载中时的文字
htmlType'button' | 'submit' | 'reset''button'按钮原生类型,在表单提交时有效
stopPropagationbooleanfalse是否阻止事件冒泡
modestring-结合表单使用时,设置 mode 值为 'form'
formstring-结合表单使用时,需要设置为所在表单组件的 form 值
classNamestring-类名

事件

事件名说明类型
onTap点击按钮,触发此回调( e: Event ) => void

插槽

名称说明
icon图标插槽

样式类

类名说明
amd-button整体样式
amd-button-content按钮内容样式
amd-button-loading-container加载区域样式
amd-button-loading-text加载区域文字样式
amd-button-loading加载动画样式
amd-button-wrap加载区域右侧样式
amd-button-icon图标样式
amd-button-text按钮文字样式
amd-button-subtext副标题样式