From e4eb2d07d747f5163a00915ab7b154e62e12a730 Mon Sep 17 00:00:00 2001
From: chenjiahan <chenjiahan@youzan.com>
Date: Sun, 13 Dec 2020 12:37:49 +0800
Subject: [PATCH] docs(Card): use composition api

---
 src/card/demo/index.vue | 41 ++++++++++++++++++++++-------------------
 1 file changed, 22 insertions(+), 19 deletions(-)

diff --git a/src/card/demo/index.vue b/src/card/demo/index.vue
index f450cbaba..ccb54765f 100644
--- a/src/card/demo/index.vue
+++ b/src/card/demo/index.vue
@@ -31,12 +31,10 @@
     >
       <template #tags>
         <div>
-          <van-tag plain type="danger" style="margin-right: 5px;">
-            标签
-          </van-tag>
-          <van-tag plain type="danger">
-            标签
+          <van-tag plain type="danger" style="margin-right: 5px">
+            {{ t('tag') }}
           </van-tag>
+          <van-tag plain type="danger">{{ t('tag') }}</van-tag>
         </div>
       </template>
 
@@ -54,22 +52,27 @@
   </demo-block>
 </template>
 
-<script>
-export default {
-  i18n: {
-    'zh-CN': {
-      title: '商品名称',
-      discountInfo: '营销信息',
-      customContent: '自定义内容',
-    },
-    'en-US': {
-      discountInfo: 'Discount Info',
-      customContent: 'Custom Content',
-    },
-  },
+<script lang="ts">
+import { useTranslate } from '@demo/use-translate';
+
+const i18n = {
+  'zh-CN': {
+    title: '商品名称',
+    discountInfo: '营销信息',
+    customContent: '自定义内容',
+  },
+  'en-US': {
+    discountInfo: 'Discount Info',
+    customContent: 'Custom Content',
+  },
+};
+
+export default {
+  setup() {
+    const t = useTranslate(i18n);
 
-  data() {
     return {
+      t,
       imageURL: 'https://img.yzcdn.cn/vant/ipad.jpeg',
     };
   },