06_Button

Button

按鈕，提供幾種基礎樣式和尺寸，可自定義圖標。

---

引入

import { Button } from 'mint-ui'; Vue.component(Button.name, Button); 

例子

改變顏色

<mt-button type="default">default</mt-button> <mt-button type="primary">primary</mt-button> <mt-button type="danger">danger</mt-button> 

改變大小

<mt-button size="small">small</mt-button> <mt-button size="large">large</mt-button> <mt-button size="normal">normal</mt-button> 

禁用按鈕

<mt-button disabled>disabled</mt-button> 

幽靈按鈕

<mt-button plain>plain</mt-button> 

帶圖標

<mt-button icon="back">back</mt-button> <mt-button icon="more">更多</mt-button> 

自定義圖標

<mt-button> <img src="../assets/100x100.png" height="20" width="20" slot="icon"> 帶自定義圖標 </mt-button> 

綁定 click 事件

<mt-button @click.native="handleClick">點擊觸發 handleClick</mt-button> 

API

參數	說明	類型	可選值	默認值
plain	幽靈按鈕	Boolean		false
disabled	禁用狀態	Boolean		false
type	按鈕顯示樣式	String	default, primary, danger	default
size	尺寸	String	small, normal, large	normal
icon	圖標	String	more, back

Slot

name	描述
-	顯示的文本內容
icon	自定義顯示的圖標