From 1c09a4475172879f91560fb0f4b07e299764ec6f Mon Sep 17 00:00:00 2001
From: neverland <chenjiahan@youzan.com>
Date: Wed, 17 Jul 2019 10:34:02 +0800
Subject: [PATCH] [new feature] Toast: add iconPrefix option (#3872)

---
 src/toast/README.md                             |  1 +
 src/toast/README.zh-CN.md                       |  1 +
 src/toast/Toast.js                              |  5 +++--
 src/toast/index.js                              |  1 +
 src/toast/test/__snapshots__/index.spec.js.snap |  7 +++++++
 src/toast/test/index.spec.js                    | 11 +++++++++++
 6 files changed, 24 insertions(+), 2 deletions(-)

diff --git a/src/toast/README.md b/src/toast/README.md
index d0e299f92..8fdd11f53 100644
--- a/src/toast/README.md
+++ b/src/toast/README.md
@@ -117,6 +117,7 @@ toast2.clear();
 | position | Can be set to `top` `middle` `bottom` | `string` | `middle` |
 | message | Message | `string` | `''` |
 | icon | Custom icon | `string` | - |
+| iconPrefix | Icon className prefix | `string` | `van-icon` |
 | 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` |
diff --git a/src/toast/README.zh-CN.md b/src/toast/README.zh-CN.md
index 4e5c56cc8..51a8abb2f 100644
--- a/src/toast/README.zh-CN.md
+++ b/src/toast/README.zh-CN.md
@@ -117,6 +117,7 @@ toast2.clear();
 | position | 位置，可选值为 `top` `bottom` | `string` | `middle` | - |
 | message | 文本内容，支持通过`\n`换行 | `string` | `''` | - | - |
 | icon | 自定义图标，支持传入图标名称或图片链接，可选值见 Icon 组件 | `string` | - | 2.0.1 |
+| iconPrefix | 图标类名前缀 | `string` | `van-icon` | 2.0.9 |
 | mask | 是否显示背景遮罩层 | `boolean` | `false` | - |
 | forbidClick | 是否禁止背景点击 | `boolean` | `false` | - |
 | loadingType | 加载图标类型, 可选值为 `spinner` | `string` | `circular` | - |
diff --git a/src/toast/Toast.js b/src/toast/Toast.js
index 5bfa48d3d..883a8bec4 100644
--- a/src/toast/Toast.js
+++ b/src/toast/Toast.js
@@ -11,6 +11,7 @@ export default createComponent({
   props: {
     icon: String,
     className: null,
+    iconPrefix: String,
     loadingType: String,
     forbidClick: Boolean,
     message: [Number, String],
@@ -77,13 +78,13 @@ export default createComponent({
   },
 
   render(h) {
-    const { type, icon, message, loadingType } = this;
+    const { type, icon, message, iconPrefix, loadingType } = this;
 
     const hasIcon = icon || (type === 'success' || type === 'fail');
 
     function ToastIcon() {
       if (hasIcon) {
-        return <Icon class={bem('icon')} name={icon || type} />;
+        return <Icon class={bem('icon')} classPrefix={iconPrefix} name={icon || type} />;
       }
 
       if (type === 'loading') {
diff --git a/src/toast/index.js b/src/toast/index.js
index b132ef629..c49ea9aa9 100644
--- a/src/toast/index.js
+++ b/src/toast/index.js
@@ -12,6 +12,7 @@ const defaultOptions = {
   onClose: null,
   onOpened: null,
   duration: 3000,
+  iconPrefix: undefined,
   position: 'middle',
   forbidClick: false,
   loadingType: undefined,
diff --git a/src/toast/test/__snapshots__/index.spec.js.snap b/src/toast/test/__snapshots__/index.spec.js.snap
index c26ce1e39..3128a0b2d 100644
--- a/src/toast/test/__snapshots__/index.spec.js.snap
+++ b/src/toast/test/__snapshots__/index.spec.js.snap
@@ -12,6 +12,13 @@ exports[`icon prop 1`] = `
 </div>
 `;
 
+exports[`icon-prefix prop 1`] = `
+<div class="van-toast van-toast--middle" style="z-index: 2005;" name="van-fade"><i class="my-icon my-icon-star-o van-toast__icon">
+    <!----></i>
+  <div class="van-toast__text">Message</div>
+</div>
+`;
+
 exports[`show html toast 1`] = `
 <div class="van-toast van-toast--middle van-toast--text" style="z-index: 2003;" name="van-fade">
   <div class="van-toast__text">
diff --git a/src/toast/test/index.spec.js b/src/toast/test/index.spec.js
index e2d16a2af..04f49467b 100644
--- a/src/toast/test/index.spec.js
+++ b/src/toast/test/index.spec.js
@@ -60,6 +60,17 @@ test('icon prop', async () => {
   expect(toast.$el.outerHTML).toMatchSnapshot();
 });
 
+test('icon-prefix prop', async () => {
+  const toast = Toast({
+    message: 'Message',
+    icon: 'star-o',
+    iconPrefix: 'my-icon'
+  });
+
+  await later();
+  expect(toast.$el.outerHTML).toMatchSnapshot();
+});
+
 test('clear toast', () => {
   const toast1 = Toast();
   expect(toast1.value).toBeTruthy();