FormMaking V3 目前支持两种语言（中文简体zh-cn、英文en） 默认使用英文，可以通过下面配置修改：

  1. app.use(FormMakingV3, {
  2.   locale: 'zh-cn'
  3.   // locale: 'en'
  4. })

多语言项目中使用

legacy

  1. import { createI18n } from 'vue-i18n'
  3. const i18n = createI18n({
  4.   legacy: true,
  5.   messages: {
  6.     'en': {},
  7.     'zh-cn': {}
  8.   }
  9. })
  11. app.use(FormMakingV3, {
  12.   locale: 'en',
  13.   i18n // 需要将配置的 i18n 传入到组件中
  14. })
  15. app.use(i18n)

Composition API

  1. import { createI18n } from 'vue-i18n'
  3. const i18n = createI18n({
  4.   legacy: false,
  5.   globalInjection: true, // 在所有组件中都可以使用 $i18n $t $rt $d $n $tm
  6. })
  8. app.use(FormMakingV3, {locale: 'zh-cn', i18n})
  9. app.use(i18n)

FormMakingV3 使用的是 legacy 模式，此处需要配置 globalInjection: true

  1. <template>
  2.   <a href="/">{{t('home')}}</a>
  4.   <select v-model="locale">
  5.     <option value="en">en</option>
  6.     <option value="zh-cn">zh-cn</option>
  7.   </select>
  8. </template>
  10. <script setup>
  11. import { useI18n } from 'vue-i18n'
  13. const { t, locale } = useI18n({
  14.   locale: 'zh-cn',
  15.   useScope: 'global',
  16.   messages: {
  17.     en: {
  18.       home: 'Home'
  19.     },
  20.     'zh-cn': {
  21.       home: '首页'
  22.     }
  23.   }
  24. })
  26. locale.value = 'en' // 动态语言切换
  27. </script>