i18n-js提示Translation message missing如何设置自定义fallback回退值

有两种实现方式，可根据你的使用场景选择：

方案1：单次调用指定兜底 #

i18n.t方法原生支持defaultValue参数，临时需要单独指定兜底的场景可以直接用：

// 翻译不存在时自动返回传入的defaultValue
i18n.t("texts.bye", { defaultValue: i18n.t("texts.fallback") });

方案2：全局配置自动兜底（推荐） #

如果希望所有未匹配到的翻译都默认返回texts.fallback，直接重写i18n实例的missingTranslation方法即可：

// 初始化i18n的代码中增加以下配置
import I18n from 'i18n-js';

const i18n = new I18n({
  // 你的多语言翻译配置，和之前保持一致即可
  zh: {
    hello: "你好！",
    texts: {
      fallback: "哎呀，加载失败啦"
    }
  },
  en: {
    hello: "Hello!",
    texts: {
      fallback: "Ups"
    }
  }
});

// 核心配置：修改翻译缺失的处理逻辑
i18n.missingTranslation = function(scope) {
  // 开发环境可以加个日志方便排查问题，生产环境可以删掉
  if (process.env.NODE_ENV === 'development') {
    console.warn(`缺失翻译项：${scope}`);
  }
  // 直接返回你预设的兜底翻译
  return this.t("texts.fallback");
};

配置完成后调用i18n.t("texts.bye")找不到对应翻译时，会自动返回texts.fallback的内容，不会再输出"missing translation..."提示。

内容的提问来源于stack exchange，提问作者Raul