Button 按钮
TIP
Button 组件对应 GvButton,下方示例可直接交互,点击「显示代码」查看源码。
基本用法
分别使用 type, plain, round, dashed 来定义按钮的样式。最后一行展示了图标按钮。
禁用状态
使用 disabled 属性来控制按钮是否为禁用状态。 该属性接受一个 Boolean 类型的值。
尺寸
使用 size 属性额外配置尺寸。
加载状态
使用 loading 属性来控制按钮是否为加载状态。 该属性接受一个 Boolean 类型的值。
API
Attributes
| 属性名 | 说明 | 类型 | 默认值 |
|---|---|---|---|
| type | 类型 | string | — |
| text | 是否为文字按钮 | boolean | false |
| otext | 设置button原始文本 | string | — |
| size | 设置button的大小 | string | default |
| visible | 设置是否可见 | boolean | true |
| confirm | 设置是否带确认框 | boolean | false |
| loading | 设置是否加载状态 | boolean | false |
| disabled | 是否禁用 | boolean | false |
| icon | 设置按钮icon图标 | string | — |
| bizType | 业务类型 | string | — |
| nativeType | 按钮按钮原生type属性 | string | button |
| refForm | 按钮关联的表单ref | string | — |
| perms | 按钮的授权权限 | string | false |
Events
| 事件名 | 说明 | 类型 |
|---|---|---|
| click | 按钮点击方法 | (event: FocusEvent) => void |
类型定义
typescript
// Button 尺寸
type ButtonSize = 'large' | 'default' | 'small';
// Button 业务类型
type ButtonBizType = 'reset' | 'import' | 'export';
// Button 按钮原生type属性
type ButtonNativeType = 'button' | 'submit' | 'reset';