From d069a0d0df7237ce67e1301ad44573dff8b05ff3 Mon Sep 17 00:00:00 2001
From: chenjiahan <chenjiahan@youzan.com>
Date: Sun, 16 Aug 2020 15:13:03 +0800
Subject: [PATCH] docs(Notify): update demo

---
 src/notify/demo/index.vue                     | 67 +++++--------------
 .../test/__snapshots__/demo.spec.js.snap      | 57 ++++++++++------
 2 files changed, 53 insertions(+), 71 deletions(-)

diff --git a/src/notify/demo/index.vue b/src/notify/demo/index.vue
index 9e52bb34b..79dbd37f2 100644
--- a/src/notify/demo/index.vue
+++ b/src/notify/demo/index.vue
@@ -1,52 +1,29 @@
 <template>
   <demo-section>
-    <demo-block :title="t('basicUsage')">
-      <van-button type="danger" :text="t('basicUsage')" @click="showNotify" />
+    <demo-block card :title="t('basicUsage')">
+      <van-cell is-link :title="t('basicUsage')" @click="showNotify" />
     </demo-block>
 
-    <demo-block :title="t('notifyType')">
-      <div style="margin-bottom: 15px;">
-        <van-button
-          type="info"
-          :text="t('primary')"
-          @click="showType('primary')"
-        />
-        <van-button
-          type="primary"
-          :text="t('success')"
-          @click="showType('success')"
-        />
-      </div>
-
-      <van-button
-        type="danger"
-        :text="t('danger')"
-        @click="showType('danger')"
-      />
-      <van-button
-        type="warning"
-        :text="t('warning')"
-        @click="showType('warning')"
-      />
+    <demo-block card :title="t('notifyType')">
+      <van-cell is-link :title="t('primary')" @click="showType('primary')" />
+      <van-cell is-link :title="t('success')" @click="showType('success')" />
+      <van-cell is-link :title="t('danger')" @click="showType('danger')" />
+      <van-cell is-link :title="t('warning')" @click="showType('warning')" />
     </demo-block>
 
-    <demo-block :title="t('customNotify')">
-      <van-button
-        type="primary"
-        :text="t('customColor')"
-        @click="showCustomColor"
-      />
-      <van-button
-        type="primary"
-        :text="t('customDuration')"
+    <demo-block card :title="t('customNotify')">
+      <van-cell is-link :title="t('customColor')" @click="showCustomColor" />
+      <van-cell
+        is-link
+        :title="t('customDuration')"
         @click="showCustomDuration"
       />
     </demo-block>
 
-    <demo-block :title="t('componentCall')">
-      <van-button
-        type="primary"
-        :text="t('componentCall')"
+    <demo-block card :title="t('componentCall')">
+      <van-cell
+        is-link
+        :title="t('componentCall')"
         @click="showComponentCall"
       />
 
@@ -129,15 +106,3 @@ export default {
   },
 };
 </script>
-
-<style lang="less">
-@import '../../style/var';
-
-.demo-notify {
-  background-color: @white;
-
-  .van-button {
-    margin-left: @padding-md;
-  }
-}
-</style>
diff --git a/src/notify/test/__snapshots__/demo.spec.js.snap b/src/notify/test/__snapshots__/demo.spec.js.snap
index 262ebad55..9ac245eef 100644
--- a/src/notify/test/__snapshots__/demo.spec.js.snap
+++ b/src/notify/test/__snapshots__/demo.spec.js.snap
@@ -2,28 +2,45 @@
 
 exports[`renders demo correctly 1`] = `
 <div>
-  <div><button class="van-button van-button--danger van-button--normal">
-      <div class="van-button__content"><span class="van-button__text">基础用法</span></div>
-    </button></div>
   <div>
-    <div style="margin-bottom: 15px;"><button class="van-button van-button--info van-button--normal">
-        <div class="van-button__content"><span class="van-button__text">主要通知</span></div>
-      </button> <button class="van-button van-button--primary van-button--normal">
-        <div class="van-button__content"><span class="van-button__text">成功通知</span></div>
-      </button></div> <button class="van-button van-button--danger van-button--normal">
-      <div class="van-button__content"><span class="van-button__text">危险通知</span></div>
-    </button> <button class="van-button van-button--warning van-button--normal">
-      <div class="van-button__content"><span class="van-button__text">警告通知</span></div>
-    </button>
+    <div role="button" tabindex="0" class="van-cell van-cell--clickable">
+      <div class="van-cell__title"><span>基础用法</span></div><i class="van-icon van-icon-arrow van-cell__right-icon">
+        <!----></i>
+    </div>
   </div>
-  <div><button class="van-button van-button--primary van-button--normal">
-      <div class="van-button__content"><span class="van-button__text">自定义颜色</span></div>
-    </button> <button class="van-button van-button--primary van-button--normal">
-      <div class="van-button__content"><span class="van-button__text">自定义时长</span></div>
-    </button></div>
-  <div><button class="van-button van-button--primary van-button--normal">
-      <div class="van-button__content"><span class="van-button__text">组件调用</span></div>
-    </button>
+  <div>
+    <div role="button" tabindex="0" class="van-cell van-cell--clickable">
+      <div class="van-cell__title"><span>主要通知</span></div><i class="van-icon van-icon-arrow van-cell__right-icon">
+        <!----></i>
+    </div>
+    <div role="button" tabindex="0" class="van-cell van-cell--clickable">
+      <div class="van-cell__title"><span>成功通知</span></div><i class="van-icon van-icon-arrow van-cell__right-icon">
+        <!----></i>
+    </div>
+    <div role="button" tabindex="0" class="van-cell van-cell--clickable">
+      <div class="van-cell__title"><span>危险通知</span></div><i class="van-icon van-icon-arrow van-cell__right-icon">
+        <!----></i>
+    </div>
+    <div role="button" tabindex="0" class="van-cell van-cell--clickable">
+      <div class="van-cell__title"><span>警告通知</span></div><i class="van-icon van-icon-arrow van-cell__right-icon">
+        <!----></i>
+    </div>
+  </div>
+  <div>
+    <div role="button" tabindex="0" class="van-cell van-cell--clickable">
+      <div class="van-cell__title"><span>自定义颜色</span></div><i class="van-icon van-icon-arrow van-cell__right-icon">
+        <!----></i>
+    </div>
+    <div role="button" tabindex="0" class="van-cell van-cell--clickable">
+      <div class="van-cell__title"><span>自定义时长</span></div><i class="van-icon van-icon-arrow van-cell__right-icon">
+        <!----></i>
+    </div>
+  </div>
+  <div>
+    <div role="button" tabindex="0" class="van-cell van-cell--clickable">
+      <div class="van-cell__title"><span>组件调用</span></div><i class="van-icon van-icon-arrow van-cell__right-icon">
+        <!----></i>
+    </div>
     <!---->
   </div>
 </div>