解决中英文问题
This commit is contained in:
1 parent
8a13dfb836
commit
42435acf7e
8 files changed
+75
-32
No files matched your search
@@ -2,7 +2,11 @@ import { createI18n } from 'vue-i18n'
|
||||
import type { I18nOptions } from 'vue-i18n';
|
||||
import type { App } from 'vue';
|
||||
import { set } from 'lodash-es';
|
||||
import axios from 'axios';
|
||||
import type { LocaleEntity } from '@/data/auto/localeEntity';
|
||||
import { WebSitePolicy } from '@/policy/custom/webSitePolicy';
|
||||
import en from './lang/en.ts';
|
||||
import cn from './lang/zh-cn.ts';
|
||||
|
||||
//这儿使用await,需要如下两步处理
|
||||
//npm install vite-plugin-top-level-await -D
|
||||
@@ -15,16 +19,14 @@ const i18n:any =createI18n( options)
|
||||
|
||||
async function createI18nOptions(): Promise<I18nOptions> {
|
||||
const locale:string='zh-cn';
|
||||
const en = await import(`./lang/en.ts`);
|
||||
const cn = await import(`./lang/zh-cn.ts`);
|
||||
|
||||
return {
|
||||
legacy: false,
|
||||
globalInjection: true, //全局生效$t
|
||||
locale: locale, // 默认cn翻译
|
||||
messages: {
|
||||
['zh-cn']: cn.default?.message,
|
||||
['en']: en.default?.message,
|
||||
['zh-cn']: cn?.message,
|
||||
['en']: en?.message,
|
||||
},
|
||||
sync: true, //If you don’t want to inherit locale from global scope, you need to set sync of i18n component option to false.
|
||||
silentTranslationWarn: true, // true - warning off
|
||||
@@ -36,6 +38,10 @@ async function createI18nOptions(): Promise<I18nOptions> {
|
||||
// setup i18n instance with global
|
||||
export async function setupI18n(app: App) {
|
||||
app.use(i18n);
|
||||
// 初始化 i18n 后拉取数据库翻译并合并。
|
||||
// 注意:不能 await,否则接口慢/挂起会阻塞 app.mount 导致白屏;
|
||||
// mergeLocaleMessage 是响应式的,合并完成界面文案会自动更新,失败只 warn。
|
||||
mergeDbLocaleMessages();
|
||||
}
|
||||
|
||||
/**
|
||||
@@ -46,12 +52,24 @@ export async function setupI18n(app: App) {
|
||||
* GroupName -> 顶层分组(对应 json 文件名的 key,如 layout / login / request)
|
||||
* Name -> 点分隔的翻译 key(如 header.logout)
|
||||
* Value -> 翻译文本
|
||||
* 需在应用启动后调用;内部使用动态 import,避免与 utils/request 形成循环依赖。
|
||||
* 需在应用启动后调用;参考 router/insideLayout.ts,直接使用 axios 裸调接口,
|
||||
* 不经过 utils/request 封装,避免与其形成循环依赖。
|
||||
*/
|
||||
export async function mergeDbLocaleMessages() {
|
||||
try {
|
||||
const { default: localeService } = await import('@/service/security/localeService');
|
||||
const list = await localeService.FindAll();
|
||||
// 参考 router/insideLayout.ts 的 axios 调用方式
|
||||
if (process.env.NODE_ENV === "development") {
|
||||
axios.defaults.baseURL = WebSitePolicy.WebApiRootDev;
|
||||
axios.defaults.withCredentials = true;
|
||||
} else {
|
||||
axios.defaults.baseURL = WebSitePolicy.WebApiRoot;
|
||||
}
|
||||
const response = await axios.create().request({
|
||||
url: "/Locale/FindAll",
|
||||
method: "get",
|
||||
});
|
||||
|
||||
const list: LocaleEntity[] = response.status == 200 ? response.data : [];
|
||||
if (!list || list.length === 0) return;
|
||||
|
||||
// 按语言分组,并将 GroupName.Name 铺平成嵌套对象
|
||||
|
||||
@@ -1,15 +1,17 @@
|
||||
{
|
||||
"login": {
|
||||
"login": "Login"
|
||||
},
|
||||
"register": {
|
||||
"twoDifferentPasswords": "Two different passwords",
|
||||
"pleaseEnterYourConfirmationPassword": "Please enter your confirmation password"
|
||||
},
|
||||
"changePassword": {
|
||||
"changePassword": "Change Password",
|
||||
"oldPassword":"Old Password",
|
||||
"newPassword":"New Password",
|
||||
"confirmPassword":"Confirm Password",
|
||||
"pleaseInputOldPassword":"Please input old password",
|
||||
"pleaseInputNewPassword":"Please input new password"
|
||||
|
||||
"oldPassword": "Old Password",
|
||||
"newPassword": "New Password",
|
||||
"confirmPassword": "Confirm Password",
|
||||
"pleaseInputOldPassword": "Please input old password",
|
||||
"pleaseInputNewPassword": "Please input new password"
|
||||
}
|
||||
}
|
||||
@@ -1,14 +1,17 @@
|
||||
{
|
||||
"login": {
|
||||
"login": "登录"
|
||||
},
|
||||
"register": {
|
||||
"pleaseEnterYourConfirmationPassword": "请输入确认密码",
|
||||
"twoDifferentPasswords": "两次密码不一样"
|
||||
},
|
||||
"changePassword": {
|
||||
"changePassword": "修改密码",
|
||||
"oldPassword":"旧密码",
|
||||
"newPassword":"新密码",
|
||||
"confirmPassword":"确认密码",
|
||||
"pleaseInputOldPassword":"请输入旧密码",
|
||||
"pleaseInputNewPassword":"请输入新密码"
|
||||
}
|
||||
}
|
||||
"oldPassword": "旧密码",
|
||||
"newPassword": "新密码",
|
||||
"confirmPassword": "确认密码",
|
||||
"pleaseInputOldPassword": "请输入旧密码",
|
||||
"pleaseInputNewPassword": "请输入新密码"
|
||||
}
|
||||
}
|
||||
Reference in new issue
Block a user