feat(i18n): 添加中文和英文语言文件，集成国际化支持

src/pages/index-page.vue

@@ -19,11 +19,6 @@ import { useI18n } from 'vue-i18n';
 
 const { locale } = useI18n();
 
-const handleLanguageChange = (event: Event) => {
-  const select = event.target as HTMLSelectElement;
-  locale.value = select.value;
-};
-
 // https://cn.vuejs.org/guide/extras/render-function#typing-functional-components
 // eslint-disable-next-line @typescript-eslint/no-unused-vars
 const FComponent: FunctionalComponent<{ prop: string }> = (props, context) => (
@@ -46,11 +41,12 @@ const FComponent: FunctionalComponent<{ prop: string }> = (props, context) => (
   </ul>
 
   <div b="1px solid pink" mt-8>
-    <select :value="locale" @change="handleLanguageChange">
-      <option value="zh_CN">中文</option>
-      <option value="en_US">English</option>
+    <select v-model="locale">
+      <option value="zh">中文</option>
+      <option value="en">English</option>
     </select>
-    <h1>{{ $t('message.hello') }}</h1>
+    <h1>{{ $t('welcome') }}</h1>
+    <p>{{ $t('hello', { name: 'John' }) }}</p>
   </div>
 
   <FComponent prop="Hello World" style="margin-top: 8px"></FComponent>