refactor: demo using script setup (#9235)

src/skeleton/demo/index.vue

@@ -1,3 +1,27 @@
+<script setup lang="ts">
+import { ref } from 'vue';
+import { useTranslate } from '@demo/use-translate';
+
+const i18n = {
+  'zh-CN': {
+    showAvatar: '显示头像',
+    showChildren: '显示子组件',
+    title: '关于 Vant',
+    desc:
+      'Vant 是一套轻量、可靠的移动端 Vue 组件库，提供了丰富的基础组件和业务组件，帮助开发者快速搭建移动应用。',
+  },
+  'en-US': {
+    showAvatar: 'Show Avatar',
+    showChildren: 'Show Children',
+    title: 'About Vant',
+    desc: 'Vant is a set of Mobile UI Components built on Vue.',
+  },
+};
+
+const t = useTranslate(i18n);
+const show = ref(false);
+</script>
+
 <template>
   <demo-block :title="t('basicUsage')">
     <van-skeleton title :row="3" />
@@ -21,39 +45,6 @@
   </demo-block>
 </template>
 
-<script lang="ts">
-import { ref } from 'vue';
-import { useTranslate } from '@demo/use-translate';
-
-const i18n = {
-  'zh-CN': {
-    showAvatar: '显示头像',
-    showChildren: '显示子组件',
-    title: '关于 Vant',
-    desc:
-      'Vant 是一套轻量、可靠的移动端 Vue 组件库，提供了丰富的基础组件和业务组件，帮助开发者快速搭建移动应用。',
-  },
-  'en-US': {
-    showAvatar: 'Show Avatar',
-    showChildren: 'Show Children',
-    title: 'About Vant',
-    desc: 'Vant is a set of Mobile UI Components built on Vue.',
-  },
-};
-
-export default {
-  setup() {
-    const t = useTranslate(i18n);
-    const show = ref(false);
-
-    return {
-      t,
-      show,
-    };
-  },
-};
-</script>
-
 <style lang="less">
 @import '../../style/var';