Skip to content

Button 按钮

Button 按钮打开
9:41
/pages/button/index

介绍

weui-button 用于触发页面主操作、次操作和警示操作,封装了 WeUI 官方按钮样式,支持加载、禁用、不同尺寸和小程序开放能力。

基础用法

vue
<template>
  <weui-button text="主要操作" />
  <weui-button type="default" text="次要操作" />
  <weui-button type="warn" text="警示操作" />
</template>

加载与禁用

vue
<weui-button text="主要操作" loading />
<weui-button text="主要操作" disabled />

尺寸

vue
<weui-button size="medium" text="中按钮" />
<weui-button size="mini" text="小按钮" inline />
<weui-button size="xmini" text="超小按钮" inline />

Props

属性说明类型默认值
text按钮文字string''
type按钮类型,可选 primarydefaultwarnstring'primary'
size按钮尺寸,可选 defaultmediumminixministring'default'
plain是否朴素按钮,预留给 WeUI plain 样式booleanfalse
disabled是否禁用booleanfalse
loading是否显示加载状态booleanfalse
nativeLoading是否使用原生 button loadingbooleanfalse
block是否块级显示booleanfalse
inline是否行内显示booleanfalse
overlay是否使用 overlay 样式booleanfalse
openType小程序开放能力,同原生 button open-typestring''
formType表单行为,同原生 button form-typestring''

Slots

插槽名说明
default自定义按钮内容

Events

事件名说明回调参数
click点击按钮时触发,禁用或加载状态下不会触发event

Released under the MIT License.