From 775f0bef470e36064f1d6f671dfd363eba78707a Mon Sep 17 00:00:00 2001
From: chenjiahan <chenjiahan@youzan.com>
Date: Tue, 15 Dec 2020 15:21:31 +0800
Subject: [PATCH] docs(NavBar): use setup

---
 src/contact-card/README.md       |  9 ++++---
 src/contact-card/README.zh-CN.md |  9 ++++---
 src/nav-bar/README.md            | 14 ++++++----
 src/nav-bar/README.zh-CN.md      | 14 ++++++----
 src/nav-bar/demo/index.vue       | 46 ++++++++++++++++++++------------
 5 files changed, 59 insertions(+), 33 deletions(-)

diff --git a/src/contact-card/README.md b/src/contact-card/README.md
index 8f6ca3233..8c0ce4407 100644
--- a/src/contact-card/README.md
+++ b/src/contact-card/README.md
@@ -22,10 +22,13 @@ app.use(ContactCard);
 import { Toast } from 'vant';
 
 export default {
-  methods: {
-    onAdd() {
+  setup() {
+    const onAdd = () => {
       Toast('add');
-    },
+    };
+    return {
+      onAdd,
+    };
   },
 };
 ```
diff --git a/src/contact-card/README.zh-CN.md b/src/contact-card/README.zh-CN.md
index e0baf255c..08ce7cbc5 100644
--- a/src/contact-card/README.zh-CN.md
+++ b/src/contact-card/README.zh-CN.md
@@ -26,10 +26,13 @@ app.use(ContactCard);
 import { Toast } from 'vant';
 
 export default {
-  methods: {
-    onAdd() {
+  setup() {
+    const onAdd = () => {
       Toast('新增');
-    },
+    };
+    return {
+      onAdd,
+    };
   },
 };
 ```
diff --git a/src/nav-bar/README.md b/src/nav-bar/README.md
index e43784ba7..89f94c55d 100644
--- a/src/nav-bar/README.md
+++ b/src/nav-bar/README.md
@@ -29,13 +29,17 @@ app.use(NavBar);
 import { Toast } from 'vant';
 
 export default {
-  methods: {
-    onClickLeft() {
+  setup() {
+    const onClickLeft = () => {
       Toast('Back');
-    },
-    onClickRight() {
+    };
+    const onClickRight = () => {
       Toast('Button');
-    },
+    };
+    return {
+      onClickLeft,
+      onClickRight,
+    };
   },
 };
 ```
diff --git a/src/nav-bar/README.zh-CN.md b/src/nav-bar/README.zh-CN.md
index 52df64fd0..0b33b60b7 100644
--- a/src/nav-bar/README.zh-CN.md
+++ b/src/nav-bar/README.zh-CN.md
@@ -29,13 +29,17 @@ app.use(NavBar);
 import { Toast } from 'vant';
 
 export default {
-  methods: {
-    onClickLeft() {
+  setup() {
+    const onClickLeft = () => {
       Toast('返回');
-    },
-    onClickRight() {
+    };
+    const onClickRight = () => {
       Toast('按钮');
-    },
+    };
+    return {
+      onClickLeft,
+      onClickRight,
+    };
   },
 };
 ```
diff --git a/src/nav-bar/demo/index.vue b/src/nav-bar/demo/index.vue
index 24678fbbc..5b6eb1558 100644
--- a/src/nav-bar/demo/index.vue
+++ b/src/nav-bar/demo/index.vue
@@ -19,24 +19,36 @@
   </demo-block>
 </template>
 
-<script>
-export default {
-  i18n: {
-    'zh-CN': {
-      useSlot: '使用插槽',
-    },
-    'en-US': {
-      useSlot: 'Use Slot',
-    },
-  },
+<script lang="ts">
+import { useTranslate } from '@demo/use-translate';
+import Toast from '../../toast';
 
-  methods: {
-    onClickLeft() {
-      this.$toast(this.t('back'));
-    },
-    onClickRight() {
-      this.$toast(this.t('button'));
-    },
+const i18n = {
+  'zh-CN': {
+    useSlot: '使用插槽',
+  },
+  'en-US': {
+    useSlot: 'Use Slot',
+  },
+};
+
+export default {
+  setup() {
+    const t = useTranslate(i18n);
+
+    const onClickLeft = () => {
+      Toast(t('back'));
+    };
+
+    const onClickRight = () => {
+      Toast(t('button'));
+    };
+
+    return {
+      t,
+      onClickLeft,
+      onClickRight,
+    };
   },
 };
 </script>