[Improvement] Toast: add loadingType option (#1049)

docs/demos/views/toast.vue

@@ -68,6 +68,7 @@ export default {
       const toast = Toast.loading({
         duration: 0,
         forbidClick: true,
+        loadingType: 'spinner',
         message: this.$t('text4', 3)
       });
 

docs/markdown/en-US/toast.md

@@ -39,6 +39,7 @@ Toast.fail('Fail');
 const toast = Toast.loading({
   duration: 0,       // continuous display toast
   forbidClick: true, // forbid click background
+  loadingType: 'spinner',
   message: '3 seconds'
 });
 
@@ -100,4 +101,5 @@ toast2.clear();
 | message | Message | `String` | `''` |
 | mask | Whether to show mask | `Boolean` | `false` |
 | forbidClick | Whether to forbid click background | `Boolean` | `false` |
+| loadingType | Loading icon type, can be set to `spinner` | `String` | `circular` |
 | duration | Toast duration(ms), won't disappear if value is 0 | `Number` | `3000` |

docs/markdown/zh-CN/toast.md

@@ -39,6 +39,7 @@ Toast.fail('失败文案');
 const toast = Toast.loading({
   duration: 0,       // 持续展示 toast
   forbidClick: true, // 禁用背景点击
+  loadingType: 'spinner',
   message: '倒计时 3 秒'
 });
 
@@ -101,4 +102,5 @@ toast2.clear();
 | message | 内容 | `String` | `''` | - |
 | mask | 是否显示背景蒙层 | `Boolean` | `false` |
 | forbidClick | 是否禁止背景点击 | `Boolean` | `false` |
+| loadingType | 加载图标类型, 可选值为 `spinner` | `String` | `circular` |
 | duration | 展示时长(ms)，值为 0 时，toast 不会消失 | `Number` | `3000` |

packages/toast/index.js

@@ -9,6 +9,7 @@ const defaultOptions = {
   value: true,
   duration: 3000,
   position: 'middle',
+  loadingType: 'circular',
   forbidClick: false,
   overlayStyle: {}
 };

packages/toast/toast.vue

@@ -7,7 +7,7 @@
 
       <!-- with icon -->
       <template v-if="displayStyle === 'default'">
-        <loading v-if="type === 'loading'" color="white" />
+        <loading v-if="type === 'loading'" color="white" :type="loadingType" />
         <icon v-else :class="b('icon')" :name="type" />
         <div v-if="hasMessage" :class="b('text')">{{ message }}</div>
       </template>
@@ -32,6 +32,10 @@ export default create({
       type: String,
       default: 'text'
     },
+    loadingType: {
+      type: String,
+      default: 'circular'
+    },
     position: {
       type: String,
       default: 'middle'