[improvement] GoodsAction: add loading & disabled prop (#1994)

packages/goods-action-big-btn/index.vue

@@ -1,10 +1,11 @@
 <template>
   <van-button
-    tag="a"
+    square
-    :href="url"
     :class="b()"
-    :type="primary ? 'primary' : 'default'"
+    size="large"
-    bottom-action
+    :loading="loading"
+    :disabled="disabled"
+    :type="primary ? 'danger' : 'warning'"
     @click="onClick"
   >
     <slot>{{ text }}</slot>
@@ -26,9 +27,10 @@ export default create({
   },
 
   props: {
-    url: String,
     text: String,
-    primary: Boolean
+    primary: Boolean,
+    loading: Boolean,
+    disabled: Boolean
   },
 
   methods: {

packages/goods-action-mini-btn/index.vue

@@ -1,8 +1,8 @@
 <template>
-  <a :href="url" :class="b()" class="van-hairline" @click="onClick">
+  <div :class="b()" class="van-hairline" @click="onClick">
     <icon :class="[b('icon'), iconClass]" :info="info" :name="icon" />
     <slot>{{ text }}</slot>
-  </a>
+  </div>
 </template>
 
 <script>
@@ -15,7 +15,6 @@ export default create({
   mixins: [RouterLink],
 
   props: {
-    url: String,
     text: String,
     info: [String, Number],
     icon: String,

packages/goods-action/en-US.md

@@ -73,6 +73,8 @@ Use `info` prop to show messages in upper right corner of icon
 |------|------|------|------|
 | text | Button text | `String` | - |
 | primary | Is primary button (red color) | `Boolean` | `false` |
+| disabled | Whether to disable button | `Boolean` | `false` |
+| loading | Whether show loading status | `Boolean` | `false` |
 | url | Link | `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 | `String` | `false` |

packages/goods-action/test/__snapshots__/demo.spec.js.snap

@@ -4,34 +4,34 @@ exports[`renders demo correctly 1`] = `
 <div>
   <div>
     <div class="van-goods-action">
-      <a class="van-hairline van-goods-action-mini-btn">
+      <div class="van-hairline van-goods-action-mini-btn">
         <i class="van-icon van-icon-chat van-goods-action-mini-btn__icon" style="color:undefined;font-size:undefined;">
           <!---->
-        </i> 客服</a>
+        </i> 客服</div>
-      <a class="van-hairline van-goods-action-mini-btn">
+      <div class="van-hairline van-goods-action-mini-btn">
         <i class="van-icon van-icon-cart van-goods-action-mini-btn__icon" style="color:undefined;font-size:undefined;">
           <!---->
-        </i> 购物车</a>
+        </i> 购物车</div>
-      <a class="van-button van-button--default van-button--normal van-button--bottom-action van-goods-action-big-btn"><span class="van-button__text">加入购物车</span></a>
+      <button class="van-button van-button--warning van-button--large van-button--square van-goods-action-big-btn"><span class="van-button__text">加入购物车</span></button>
-      <a class="van-button van-button--primary van-button--normal van-button--bottom-action van-goods-action-big-btn"><span class="van-button__text">立即购买</span></a>
+      <button class="van-button van-button--danger van-button--large van-button--square van-goods-action-big-btn"><span class="van-button__text">立即购买</span></button>
     </div>
   </div>
   <div>
     <div class="van-goods-action">
-      <a class="van-hairline van-goods-action-mini-btn">
+      <div class="van-hairline van-goods-action-mini-btn">
         <i class="van-icon van-icon-chat van-goods-action-mini-btn__icon" style="color:undefined;font-size:undefined;">
           <!---->
-        </i> 客服</a>
+        </i> 客服</div>
-      <a class="van-hairline van-goods-action-mini-btn">
+      <div class="van-hairline van-goods-action-mini-btn">
         <i class="van-icon van-icon-cart van-goods-action-mini-btn__icon" style="color:undefined;font-size:undefined;">
           <div class="van-info">5</div>
-        </i> 购物车</a>
+        </i> 购物车</div>
-      <a class="van-hairline van-goods-action-mini-btn">
+      <div class="van-hairline van-goods-action-mini-btn">
         <i class="van-icon van-icon-shop van-goods-action-mini-btn__icon" style="color:undefined;font-size:undefined;">
           <!---->
-        </i> 店铺</a>
+        </i> 店铺</div>
-      <a class="van-button van-button--default van-button--normal van-button--bottom-action van-goods-action-big-btn"><span class="van-button__text">加入购物车</span></a>
+      <button class="van-button van-button--warning van-button--large van-button--square van-goods-action-big-btn"><span class="van-button__text">加入购物车</span></button>
-      <a class="van-button van-button--primary van-button--normal van-button--bottom-action van-goods-action-big-btn"><span class="van-button__text">立即购买</span></a>
+      <button class="van-button van-button--danger van-button--large van-button--square van-goods-action-big-btn"><span class="van-button__text">立即购买</span></button>
     </div>
   </div>
 </div>

packages/goods-action/zh-CN.md

@@ -72,6 +72,8 @@ export default {
 |------|------|------|------|------|
 | text | 按钮文字 | `String` | - | - |
 | primary | 是否为红色按钮 | `Boolean` | `false` | - |
+| disabled | 是否禁用按钮 | `Boolean` | `false` | - | 1.3.10 |
+| loading | 是否显示为加载状态 | `Boolean` | `false` | - | 1.3.10 |
 | url | 跳转链接 | `String` | - | - |
 | to | 路由跳转对象，同 `vue-router` 的 to | `String | Object` | - | - |
 | replace | 跳转时是否替换当前 history | `String` | `false` | - |

packages/swipe/test/index.spec.js

@@ -43,27 +43,6 @@ const Component = {
   }
 };
 
-test('autoplay', async() => {
-  const wrapper = mount(Component, {
-    propsData: {
-      autoplay: 20
-    }
-  });
-  const { swipe } = wrapper.vm.$refs;
-
-  await later(60);
-  expect(swipe.active).toEqual(1);
-  wrapper.setData({ autoplay: 0 });
-
-  await later(60);
-  expect(swipe.active).toEqual(1);
-  wrapper.setData({ autoplay: 20 });
-
-  await later(60);
-  expect(swipe.active).toEqual(2);
-  wrapper.destroy();
-});
-
 test('swipeTo', async() => {
   const wrapper = mount(Component);
   const { swipe } = wrapper.vm.$refs;