# Button 按钮

<h4>按钮类型</h4>
<amber-button>默认按钮</amber-button>
<amber-button type="primary">主色调</amber-button> 
<amber-button type="warning">提示按钮</amber-button>
<amber-button type="danger">警示按钮</amber-button>

<h4>按钮大小</h4>
<amber-button type="primary" size="small">小按钮</amber-button>
<amber-button type="primary" size="normal">中按钮</amber-button>
<amber-button type="primary" size="large">大按钮</amber-button>

<h4>图标按钮</h4>
<amber-button icon="a-yanjing3x" type="primary">图标按钮</amber-button> 

<h4>圆角按钮</h4>
<amber-button  type="primary" size="small" round>圆角按钮</amber-button> 
<amber-button  type="primary" size="normal" round>圆角按钮</amber-button> 
<amber-button  type="primary" size="large" round>圆角按钮</amber-button> 

<h4>圆形按钮</h4>
<amber-button  type="primary" size='small' circle>圆形按钮</amber-button>
<amber-button  type="primary" size='normal' circle>圆形按钮</amber-button>
<amber-button  type="primary" size='large' circle>圆形按钮</amber-button>

<h4>朴素按钮</h4>
<amber-button>默认按钮</amber-button>
<amber-button plain="true" type="primary">主色调</amber-button> 
<amber-button plain="true" type="warning">提示按钮</amber-button>
<amber-button plain="true" type="danger">警示按钮</amber-button>

<h4>文字按钮</h4>
<amber-button text>默认按钮</amber-button>
<amber-button text type="primary">主色调</amber-button> 
<amber-button text type="warning">提示按钮</amber-button>
<amber-button text type="danger">警示按钮</amber-button>

<h4>禁用状态</h4>
<amber-button @click="click" disabled>默认按钮</amber-button>

<h4>加载状态</h4>
<amber-button @click="click" loading type="primary">主色调</amber-button>

<script>
export default {
  mounted() {
    console.log(this.$icon)
  },
  methods: {
    click() {
      console.log('按钮点击')
    }
  }
}
</script>