如何访问位于 Vuei18n 中不同文件夹中的不同语言环境文件？

Question

我想实施一个针对特定性别的区域设置管理系统，这意味着对于某些语言（例如希伯来语和阿拉伯语），男性和女性的文本会有所不同。所以我所做的是，为男性和女性创建了单独的文件。这是我的目录结构-

locales
  female
    he.json
    ar.json
  male
    he.json
    ar.json
  en.json

现在，我希望对于女性用户，区域设置文件应该从女性文件夹中选择，如果是男性用户，则应该从男性文件夹中选择。对于英语，文件“en.json”对于男性和女性都是相同的。

性别详细信息存储在 Vue 状态中，因此在 i18n.js 文件中，我正在检查用户的性别并更新语言环境文件的路径。这是我的 i18n.js 文件-

import Vue from "vue";
import VueI18n from "vue-i18n";
import { DEFINES } from "@/defines";
import { store } from "@/store";

Vue.use(VueI18n);

function getRelevantLocale() {
    if (
        !Object.entries(store.state.user.user).length ||
        store.state.user.user.user_lang === "en"
    ) {
        return require.context("./locales", true, /[A-Za-z0-9-_,\s]+\.json$/i);
    } else if (store.state.user.user.gender === "female") {
        return require.context(
            "./locales/female",
            true,
            /[A-Za-z0-9-_,\s]+\.json$/i,
        );
    } else if (store.state.user.user.gender === "male") {
        return require.context("./locales/male", true, /[A-Za-z0-9-_,\s]+\.json$/i);
    }
}

export const loadLocaleMessages = () => {
    const locales = getRelevantLocale();
    const messages = {};
    locales.keys().forEach((key) => {
    const matched = key.match(/([A-Za-z0-9-_]+)\./i);
    if (matched && matched.length > 1) {
        const locale = matched[1];
        messages[locale] = locales(key);
    }
    });
    return messages;
};

export const i18n = new VueI18n({
    messages: loadLocaleMessages(),
    locale: DEFINES.I18N_LOCALE || "en",
    fallbackLocale: DEFINES.I18N_FALLBACK_LOCALE || "en",
    silentFallbackWarn: true,
});

问题是，当性别或语言发生变化时，区域设置路径不会更新，即如果语言是希伯来语且性别是女性，而我转向了具有相同性别的语言英语，i18n 没有选择正确的文件从“locales/en.json”直到我重新加载页面。

任何人都可以提出建议吗？

Answer 1

我找到了解决办法。

每当更改语言环境时，都会更新该语言环境的消息。

假设设置了区域设置“en”并且“en”的消息来自“locales/en.json”文件，现在我们切换到区域设置“he”任何性别让我们说“男性”然后“他”的消息应该来自“locales/male/he。json”文件。

为此，只需在切换语言环境后添加此行-

// Set locale
i18n.locale = "he";

// Update messages for this locale
i18n.setLocaleMessage("he", loadLocaleMessages()["he"]);

如何访问位于 Vuei18n 中不同文件夹中的不同语言环境文件？

How to access different locale files situated in different folder in Vuei18n?

locale

dynamic

internationalization

vuejs2

vue-i18n