[new feature] add spinner type loading (#297)

* [bugfix] CouponList always show empty info

* [bugfix] add click feedback of buttons in components

* [Doc] add custom theme document

* [new feature] Notice bar support more props

* [bugfix] PullRefresh test cases

* [bugfix] unused NoticeBar style

* [bugfix] Swipe width calc error

* [Doc] english document of all action components

* [Doc] change document site path to /zanui/vant

* [Doc] fix

* [bugfix] uploader style error

* [bugfix] tabs document demo

* [new feature] Cell support vue-router target route

* [bugfix] add cell test cases

* update yarn.lock

* [bugfix] Tabbar cann't display info when use icon slot

* [Doc] update document title

* [bugfix] Dialog should reset button text when showed

* [new feature] CouponList add showCloseButton prop

* [new feature] Swipe add 'initialSwipe' prop

* [bugfix] NoticeBar text disappeared when page back

* [new feature] ImagePreview support startPosition

* fix: improve imagePreview test cases

* [bugfix] Steps style error when has more than 4 items

* [new feature] normalize size of all icons

* [new feature] Stepper add plus & minus event

* fix: yarn.lock

* [bugfix] addressEdit icon render failed

* [new feature] toast add mask option

* [new feature] add spinner type loading

docs/examples-docs/en-US/loading.md

@@ -9,27 +9,36 @@ Vue.component(Loading.name, Loading);
 
 ### Usage
 
-#### Solid color
+#### Solid Circle
 
-:::demo Solid color
+:::demo Solid Circle
 ```html
 <van-loading type="circle" color="black"></van-loading>
 <van-loading type="circle" color="white"></van-loading>
 ```
 :::
 
-#### Gradient color
+#### Gradient Circle
 
-:::demo Gradient color
+:::demo Gradient Circle
 ```html
 <van-loading type="gradient-circle" color="black"></van-loading>
 <van-loading type="gradient-circle" color="white"></van-loading>
 ```
 :::
 
+#### Spinner
+
+:::demo Spinner
+```html
+<van-loading type="spinner" color="black"></van-loading>
+<van-loading type="spinner" color="white"></van-loading>
+```
+:::
+
 ### API
 
 | Attribute | Description | Type | Default | Accepted Values |
 |-----------|-----------|-----------|-------------|-------------|
 | color | Color | `String` | `black` | `black` `white` |
-| type | Type | `String` | `gradient-circle` | `gradient-circle` `circle` |
+| type | Type | `String` | `gradient-circle` | `spinner` `circle` |

docs/examples-docs/zh-CN/loading.md

@@ -18,27 +18,36 @@ Vue.component(Loading.name, Loading);
 
 ### 代码演示
 
-#### 单色 spinner
+#### 单色圆环
 
-:::demo 单色 spinner
+:::demo 单色圆环
 ```html
 <van-loading type="circle" color="black"></van-loading>
 <van-loading type="circle" color="white"></van-loading>
 ```
 :::
 
-#### 渐变色 spinner
+#### 渐变色圆环
 
-:::demo 渐变色 spinner
+:::demo 渐变色圆环
 ```html
 <van-loading type="gradient-circle" color="black"></van-loading>
 <van-loading type="gradient-circle" color="white"></van-loading>
 ```
 :::
 
+#### Spinner
+
+:::demo Spinner
+```html
+<van-loading type="spinner" color="black"></van-loading>
+<van-loading type="spinner" color="white"></van-loading>
+```
+:::
+
 ### API
 
 | 参数 | 说明 | 类型 | 默认值 | 可选值 |
 |-----------|-----------|-----------|-------------|-------------|
 | color | 颜色 | `String` | `black` | `black` `white` |
-| type | 类型 | `String` | `gradient-circle` | `gradient-circle` `circle` |
+| type | 类型 | `String` | `gradient-circle` | `spinner` `circle` |

packages/loading/index.vue

@@ -1,11 +1,13 @@
 <template>
-  <div :class="['van-loading', 'van-loading--' + type]">
+  <div :class="['van-loading', 'van-loading--' + type, 'van-loading--' + color]">
-    <span :class="['van-loading__spinner', 'van-loading__spinner--' + type, 'van-loading__spinner--' + color]"></span>
+    <span :class="['van-loading__spinner', 'van-loading__spinner--' + type, 'van-loading__spinner--' + color]">
+      <i v-if="type === 'spinner'" v-for="item in 12"></i>
+    </span>
   </div>
 </template>
 
 <script>
-const VALID_TYPES = ['gradient-circle', 'circle'];
+const VALID_TYPES = ['gradient-circle', 'circle', 'spinner'];
 const VALID_COLORS = ['black', 'white'];
 
 export default {