在世博项目中不起作用的i18next日期时间格式

Question

我的i18.js文件(在App.js中导入)参见下面的编辑

我的en.json文件

{
  home: {
    "time": "{{stime, datetime}} to {{etime, datetime}}",
  }
}

组件中的翻译代码

const i18timeFormat = { hour: "numeric", minute: "numeric", hour12: true };
return (
    <Text>
      t("home.time",
        {{
          stime: starttime,
          etime: endtime,
          formatParams: { stime: i18timeFormat, etime: i18timeFormat },
        }}
      )
    </Text>
  );

预期产出

8:30 am to 10:30 am

实际输出

Wed Apr 13 2022 08:30:12 GMT+0530 (IST) to Wed Apr 13 2022 10:30:12 GMT+0530 (IST)

我也尝试过官方的例子。，即使它不格式化。有什么我能修好的吗？

编辑：

我已经将以下软件包添加到polyfill intl日期时间和相对时间。

"@formatjs/intl-datetimeformat": "^5.0.1",
"@formatjs/intl-getcanonicallocales": "^1.9.2",
"@formatjs/intl-locale": "^2.4.47",
"@formatjs/intl-numberformat": "^7.4.3",
"@formatjs/intl-pluralrules": "^4.3.3",
"@formatjs/intl-relativetimeformat": "^10.0.1",

i18.js文件

import "@formatjs/intl-getcanonicallocales/polyfill";
import "@formatjs/intl-locale/polyfill-force";
import "@formatjs/intl-numberformat/polyfill-force";
import "@formatjs/intl-pluralrules/polyfill-force";

import "@formatjs/intl-datetimeformat/polyfill-force";
import "@formatjs/intl-datetimeformat/locale-data/en";
import "@formatjs/intl-datetimeformat/add-all-tz"; // Add ALL tz data

import "@formatjs/intl-relativetimeformat/polyfill-force";
import "@formatjs/intl-relativetimeformat/locale-data/en";

import i18n from "i18next";
import { initReactI18next } from "react-i18next";
import * as Localization from "expo-localization";

import en from "./i18n/en.json";

const resources = {
  en: { translation: en }
};

i18n.use(initReactI18next).init({
  resources,
  lng: "en",
  fallbackLng: "en",
});

export default i18n;

编辑2：

调试后的警告设置为true。

Missing locale data for 
at node_modules/@formatjs/intl-localematcher/abstract/utils.js:8:14 in invariant
at node_modules/@formatjs/intl-localematcher/abstract/ResolveLocale.js:25:8 in ResolveLocale
at node_modules/@formatjs/ecma402-abstract/NumberFormat/InitializeNumberFormat.js:31:12 in InitializeNumberFormat
at node_modules/@formatjs/intl-numberformat/src/core.js:37:4 in exports.NumberFormat
at node_modules/@formatjs/intl-datetimeformat/src/abstract/FormatDateTimePattern.js:51:13 in FormatDateTimePattern
at node_modules/@formatjs/intl-datetimeformat/src/abstract/FormatDateTime.js:11:16 in FormatDateTime
at node_modules/i18next/dist/cjs/i18next.js:1800:24 in formats.reduce$argument_0
at node_modules/i18next/dist/cjs/i18next.js:1789:19 in format
at node_modules/i18next/dist/cjs/i18next.js:1581:30 in todos.forEach$argument_0
at node_modules/i18next/dist/cjs/i18next.js:1576:6 in interpolate
at node_modules/i18next/dist/cjs/i18next.js:843:14 in extendTranslation
at node_modules/i18next/dist/cjs/i18next.js:806:14 in translate
at src/components/gate/timeBlock/index.js:74:10 in TimeBlock

Answer 1

就像新的复数规则：https://www.i18next.com/how-to/faq#why-are-my-plural-keys-not-working

您还可以为内置格式使用其他填充：https://www.i18next.com/translation-function/formatting。