VueJS i18n - 如何更改翻译文件中的变量前缀

Question

我正在使用Laravel惯性和Vue做一个应用程序，我们想将i18n添加到应用程序中，并为laravel和i18n使用相同的翻译文件，问题是变量插值，laravel默认使用:variable但vue i18n使用{variable}

我尝试根据我在这里找到的内容创建自定义格式化程序，但使用自定义格式化程序似乎已被弃用，因为我的控制台中有此：[intlify] Not supported 'formatter'.

我在官方 i18n 文档中看到 i18n 应该有一个用于变量插值的前缀和后缀的选项，但它似乎不存在于 vue-i18n 中。

有没有人经历过这个或有解决这个“问题”的想法？

Answer 1

我在翻译 json 中运行 for 循环并将:variable语法转换为{variable}

import {createI18n} from 'vue-i18n'
import zhCN from '../lang/zh-CN.json';

export function initializeI18n() {
    let en = {};

    Object.entries(zhCN).forEach(([key, value]) => {
        let newEnValue = key;
        en[key] = key;

        if (value.includes(':')) {
            let arr = value.match(/\B\:\w+/ig);
            arr.forEach(matchedStr => {
                let cleanMatchedStr = matchedStr.replace(':', '')
                value = value.replace(matchedStr, `{${cleanMatchedStr}}`)
                newEnValue = newEnValue.replace(matchedStr, `{${cleanMatchedStr}}`)
            })
            zhCN[key] = value;
            en[key] = newEnValue;
        }
    })

    return createI18n({
        locale: window.__DEFAULT_LOCALE__,
        fallbackLocale: window.__FALLBACK_LOCALE__,
        messages: {
            'zh-CN': zhCN,
            en
        },
        silentFallbackWarn: true,
        silentTranslationWarn: true
    });
}

这是，放入 es.js

"Hello :name": "Hola :name"

应该按预期工作：

{{ $t("Hello :name", {name: 'world'}) }},