From 9c33c6443a47619bd2217a8da184c568700c993f Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=8C=83=E6=96=87=E6=9D=B0?= <wenjie.fan@malong.com>
Date: Tue, 7 Aug 2018 23:40:05 +0800
Subject: [PATCH 1/3] =?UTF-8?q?[unit]=20=E6=B7=BB=E5=8A=A0button=E6=B5=8B?=
 =?UTF-8?q?=E8=AF=95=E7=94=A8=E4=BE=8B?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 test/unit/specs/button.spec.js | 24 ++++++++++++++++++++++++
 1 file changed, 24 insertions(+)
 create mode 100644 test/unit/specs/button.spec.js

diff --git a/test/unit/specs/button.spec.js b/test/unit/specs/button.spec.js
new file mode 100644
index 00000000..ab2341ca
--- /dev/null
+++ b/test/unit/specs/button.spec.js
@@ -0,0 +1,24 @@
+import { createVue, destroyVM } from '../util';
+
+describe('Button.vue', () => {
+  let vm;
+  afterEach(() => {
+    destroyVM(vm);
+  });
+
+  it('should render as <a>', done => {
+    vm = createVue(`
+      <Button to="http://www.thinkinfe.tech/">Think in FE</Button>
+    `);
+    expect(vm.$el.tagName).to.equal('A');
+    done();
+  });
+
+  it('should render as <button>', done => {
+    vm = createVue(`
+      <Button>Think in FE</Button>
+    `);
+    expect(vm.$el.tagName).to.equal('BUTTON');
+    done();
+  });
+});

From 0f8452047db35074af15bcaf0bfafa2c67561d78 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=8C=83=E6=96=87=E6=9D=B0?= <wenjie.fan@malong.com>
Date: Wed, 8 Aug 2018 14:30:16 +0800
Subject: [PATCH 2/3] =?UTF-8?q?[unit]=20=E5=AE=9A=E4=B9=89=E6=9B=B4?=
 =?UTF-8?q?=E5=A4=9Abutton=E6=B5=8B=E8=AF=95=E7=94=A8=E4=BE=8B?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 test/unit/specs/button.spec.js | 42 ++++++++++++++++++++++++++++++++++
 1 file changed, 42 insertions(+)

diff --git a/test/unit/specs/button.spec.js b/test/unit/specs/button.spec.js
index ab2341ca..2d8e2809 100644
--- a/test/unit/specs/button.spec.js
+++ b/test/unit/specs/button.spec.js
@@ -21,4 +21,46 @@ describe('Button.vue', () => {
     expect(vm.$el.tagName).to.equal('BUTTON');
     done();
   });
+
+  it('handle with `type` attribute', done => {
+    // should render with `type` attribute
+    // if it is a <button>
+    vm = createVue(`
+      <Button htmlType="reset">Think in FE</Button>
+    `);
+    expect(vm.$el.getAttribute('type')).to.equal('reset');
+
+    // should't render with `type` attribute
+    // if it is a <button>
+    vm = createVue(`
+      <Button to="http://www.thinkinfe.tech/" htmlType="reset">Think in FE</Button>
+    `);
+    expect(vm.$el.getAttribute('type')).to.equal(null);
+    done();
+  });
+
+  it('should change loading state', done => {
+    vm = createVue({
+        template: `
+            <Button :loading="loading" @click="fetch">Think in FE</Button>
+        `,
+        data() {
+            return {loading: false};
+        },
+        methods: {
+            fetch() {
+                this.loading = true;
+            }
+        }
+    });
+    vm.$el.click();
+    vm.$nextTick(() => {
+      expect(vm.$el.classList.contains('ivu-btn-loading')).to.equal(true);
+      const $icons = vm.$el.querySelectorAll('.ivu-icon');
+      expect($icons.length).to.equal(1);
+      expect($icons[0].classList.contains('ivu-load-loop')).to.equal(true);
+      expect($icons[0].classList.contains('ivu-icon-ios-loading')).to.equal(true);
+      done();
+    });
+  });
 });

From d77476f87a886a85da15ab23e7ea40aed0b5baeb Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=8C=83=E6=96=87=E6=9D=B0?= <wenjie.fan@malong.com>
Date: Wed, 8 Aug 2018 14:30:50 +0800
Subject: [PATCH 3/3] =?UTF-8?q?[feature]=20=E4=BC=98=E5=8C=96button?=
 =?UTF-8?q?=E4=BB=A3=E7=A0=81=EF=BC=8C=E4=BB=A3=E7=A0=81=E6=9B=B4=E7=AE=80?=
 =?UTF-8?q?=E6=B4=81?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/button/button.vue | 46 +++++++++++++++++---------------
 1 file changed, 24 insertions(+), 22 deletions(-)

diff --git a/src/components/button/button.vue b/src/components/button/button.vue
index 6001e607..6a79e9c2 100644
--- a/src/components/button/button.vue
+++ b/src/components/button/button.vue
@@ -1,27 +1,9 @@
 <template>
-    <a
-        v-if="to"
-        :class="classes"
-        :disabled="disabled"
-        :href="linkUrl"
-        :target="target"
-        @click.exact="handleClickLink($event, false)"
-        @click.ctrl="handleClickLink($event, true)"
-        @click.meta="handleClickLink($event, true)">
+    <component :is="tagName" :class="classes" :disabled="disabled" @click="handleClickLink" v-bind="tagProps">
         <Icon class="ivu-load-loop" type="ios-loading" v-if="loading"></Icon>
         <Icon :type="icon" :custom="customIcon" v-if="(icon || customIcon) && !loading"></Icon>
         <span v-if="showSlot" ref="slot"><slot></slot></span>
-    </a>
-    <button
-        v-else
-        :type="htmlType"
-        :class="classes"
-        :disabled="disabled"
-        @click="handleClickLink">
-        <Icon class="ivu-load-loop" type="ios-loading" v-if="loading"></Icon>
-        <Icon :type="icon" :custom="customIcon" v-if="(icon || customIcon) && !loading"></Icon>
-        <span v-if="showSlot" ref="slot"><slot></slot></span>
-    </button>
+    </component>
 </template>
 <script>
     import Icon from '../icon';
@@ -98,14 +80,34 @@
                         [`${prefixCls}-ghost`]: this.ghost
                     }
                 ];
+            },
+            // Point out if it should render as <a> tag
+            isHrefPattern() {
+                const {to} = this;
+                return !!to;
+            },
+            tagName() {
+                const {isHrefPattern} = this;
+                return isHrefPattern ? 'a' : 'button';
+            },
+            tagProps() {
+                const {isHrefPattern} = this;
+                if(isHrefPattern) {
+                    const {linkUrl,target}=this;
+                    return {href: linkUrl, target};
+                } else {
+                    const {htmlType} = this;
+                    return {type: htmlType};
+                }
             }
         },
         methods: {
             // Ctrl or CMD and click, open in new window when use `to`
-            handleClickLink (event, new_window = false) {
+            handleClickLink (event) {
                 this.$emit('click', event);
+                const openInNewWindow = event.ctrlKey || event.metaKey;
 
-                this.handleCheckClick(event, new_window);
+                this.handleCheckClick(event, openInNewWindow);
             }
         },
         mounted () {