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',
     };
   },