## Button ### Install ``` javascript import { Button } from 'vant'; Vue.use(Button); ``` ### Usage #### Type ```html Default Primary Info Danger Warning ``` #### Plain ```html Primary Danger ``` #### Hairline ```html Hairline Hairline ``` #### Disabled ```html Diabled Diabled ``` #### Loading ```html ``` #### Shape ```html Square Round ``` #### Size ```html Large Normal Small Mini ``` ### API | Attribute | Description | Type | Default | |------|------|------|------| | type | Can be set to `primary` `info` `warning` `danger` | `String` | `default` | | size | Can be set to `large` `small` `mini` | `String` | `normal` | | text | Text | `String` | - | | tag | HTML Tag | `String` | `button` | | native-type | Native Type Attribute | `String` | `''` | | plain | Whether to be plain button | `Boolean` | `false` | | block | Whether to set display block | `Boolean` | `false` | | round | Whether to be round button | `Boolean` | `false` | | square | Whether to be square button | `Boolean` | `false` | | disabled | Whether to disable button | `Boolean` | `false` | | loading | Whether show loading status | `Boolean` | `false` | | loading-text | Loading text | `String` | - | | loading-size | Loading icon size | `String` | `20px` | | url | Link URL | `String` | - | | to | Target route of the link, same as to of `vue-router` | `String | Object` | - | | replace | If true, the navigation will not leave a history record | `Boolean` | `false` | ### Event | Event | Description | Arguments | |------|------|------| | click | Triggered when click button and not disabled or loading | event: Event | | touchstart | Triggered when touch start | event: TouchEvent |