refactor: demo using script setup (#9235)

src/submit-bar/demo/index.vue

@@ -1,3 +1,36 @@
+<script setup lang="ts">
+import { ref } from 'vue';
+import { useTranslate } from '@demo/use-translate';
+import { Toast } from '../../toast';
+
+const i18n = {
+  'zh-CN': {
+    tip1: '你的收货地址不支持同城送, 我们已为你推荐快递',
+    tip2: '你的收货地址不支持同城送, ',
+    tip3: '修改地址',
+    check: '全选',
+    submit: '提交订单',
+    clickLink: '修改地址',
+    clickButton: '点击按钮',
+  },
+  'en-US': {
+    tip1: 'Some tips',
+    tip2: 'Some tips, ',
+    tip3: 'Link',
+    check: 'Label',
+    submit: 'Submit',
+    clickLink: 'Click Link',
+    clickButton: 'Submit',
+  },
+};
+
+const t = useTranslate(i18n);
+const checked = ref(true);
+
+const onSubmit = () => Toast(t('clickButton'));
+const onClickLink = () => Toast(t('clickLink'));
+</script>
+
 <template>
   <demo-block :title="t('basicUsage')">
     <van-submit-bar
@@ -39,50 +72,7 @@
     </van-submit-bar>
   </demo-block>
 </template>
-
-<script lang="ts">
-import { ref } from 'vue';
-import { useTranslate } from '@demo/use-translate';
-import { Toast } from '../../toast';
-
-const i18n = {
-  'zh-CN': {
-    tip1: '你的收货地址不支持同城送, 我们已为你推荐快递',
-    tip2: '你的收货地址不支持同城送, ',
-    tip3: '修改地址',
-    check: '全选',
-    submit: '提交订单',
-    clickLink: '修改地址',
-    clickButton: '点击按钮',
-  },
-  'en-US': {
-    tip1: 'Some tips',
-    tip2: 'Some tips, ',
-    tip3: 'Link',
-    check: 'Label',
-    submit: 'Submit',
-    clickLink: 'Click Link',
-    clickButton: 'Submit',
-  },
-};
-
-export default {
-  setup() {
-    const t = useTranslate(i18n);
-    const checked = ref(true);
-
-    const onSubmit = () => Toast(t('clickButton'));
-    const onClickLink = () => Toast(t('clickLink'));
-
-    return {
-      t,
-      checked,
-      onSubmit,
-      onClickLink,
-    };
-  },
-};
-</script>
+Ï
 
 <style lang="less">
 @import '../../style/var';