category:
  en: Basic
  zh-CN: 基础组件
icon: '&#xe616;'
tags:
  en:
    - button
    - form
  zh-CN:
    - 表单
    - 按钮
tips:
  en:
    -
      q: |
        @click event binding not working
      a: |
        As `Vue`[document](https://vuejs.org/v2/guide/components-custom-events.html#Binding-Native-Events-to-Components) says，use `.native` modifier for `v-on`, so you should use `@click.native`。
  zh-CN:
    -
      q: |
        @click 绑定事件不生效
      a: |
        按照`Vue`[文档](https://cn.vuejs.org/v2/guide/components.html#%E7%BB%99%E7%BB%84%E4%BB%B6%E7%BB%91%E5%AE%9A%E5%8E%9F%E7%94%9F%E4%BA%8B%E4%BB%B6)，在组件上绑定原生点击事件请使用`@click.native`。
props:
  type:
    type: String
    default: default
    en: button style type, one of `default`, `primary`, `warn`
    zh-CN: 按钮类型，可选值为 `default`,`primary`,`warn`
  disabled:
    type: Boolean
    default: false
    en: if disable the button
    zh-CN: 是否不可点击
  text:
    type: String
    default: ''
    en: button text, has the same function as default slot
    zh-CN: 按钮文字，同默认slot
  mini:
    type: Boolean
    default: false
    en: if use smaller style
    zh-CN: 是否为mini类型，即小尺寸的按钮
  plain:
    type: Boolean
    default: false
    en: if use plain styles which has no backgroundColor
    zh-CN: 是否是plain样式，没有背景色
  action-type:
    en: button's type value, one of `submit`, `button`, `reset`
    zh-CN: '`button`的type属性，默认为浏览器默认(submit)，可选为 `submit` `button` `reset`'
  link:
    version: v2.3.5
    en: 'vue-router path, `BACK` is alias to `go(-1)`'
    zh-CN: 'vue-router 路由, 值为 `BACK` 等同于 `go(-1)`'
  show-loading:
    type: Boolean
    default: false
    en: 'show loading icon'
    zh-CN: '显示加载图标'
  gradients:
    version: v2.7.4
    type: Array
    en: 'iOS design gradients, Array length should be 2'
    zh-CN: '按钮背景渐变，长度必须为2'
slots:
  default:
    en: button text
    zh-CN: 按钮文字
changes:
  v2.9.2:
    en:
      - '[feature] support styles variable for button #2748'
    zh-CN:
      - '[feature] button支持样式变量 #2748'
  v2.9.0:
    en:
      - '[feature] support plain for warn-button #2478'
    zh-CN:
      - '[feature] warn 类型支持 plain 样式 #2478'
  v2.7.5:
    en:
      - '[fix] fix plain and disabled class error'
    zh-CN:
      - '[fix] 修复plain样式并禁用时class不对的问题'
  v2.7.4:
    en:
      - '[feature] add prop:gradients for iOS design gradients'
    zh-CN:
      - '[feature] 顺应 iOS 设计，支持直接定义背景渐变 prop:gradients'
  v2.7.1:
    en:
      - '[enhance] support object-link #2068'
    zh-CN:
      - '[enhance] 链接支持对象类型 #2068'
  v2.5.0:
    en:
      - '[feature] Add primary、warn disabled bg color. #1630'
    zh-CN:
      - '[feature] 添加禁用背景颜色. #1630'
  v2.1.1-rc.10:
    en:
      - '[feature] Add default disabled bg color. #896'
    zh-CN:
      - '[feature] 添加禁用背景颜色. #896'
  v2.1.1-rc.3:
    en:
      - '[fix] Fix no loading style if not using Loading component #986 @malaimoo'
    zh-CN:
      - '[fix] 修复单独引入没有引入Loading组件时，样式缺失 #986 @malaimoo'
  v2.1.0:
    zh-CN:
      - '[feature] 更新到 `WeUI` 最新版本'
      - '[feature] 支持 `prop:isLoading`'
  v2.1.0-rc.46:
      zh-CN:
        - '[feature] 添加`less`变量 #896 @erguotou520'
  v2.1.1-rc.12:
      en:
        - '[fix] Fix primary button active background-color'
      zh-CN:
        - '[fix] 修复primary类型按钮active时的background-color'
