i18next：在TypeScript中映射对象数组

问题描述

我正在将React项目重写为TypeScript。

包装：Next.js，next-i18next，样式化组件

我在语言json文件中使用了一组对象：

{
  "websites":
  [
    {
      "slug": "website-a","name": "Website A"
    },{
      "slug": "website-b","name": "Website B"
    }
  ]
}

使用i18next的{ t }列出所有这些文件：

t('websites',{returnObjects: true}).map(({slug,name}) => ( ... ))

TypeScript带下划线map：

Property 'map' does not exist on type 'string'.

用TypeScript重写：

type websiteProps = {
  map: Function;
};

type itemProps = {
  slug: string;
  name: string;
};

t<websiteProps>('websites',name}: itemProps) => ( ... ))

这有效，但是我想知道我是否只是为.map下划线。 有什么我可以做的更好的吗？

谢谢！

解决方法

我对i18不太了解，但是请尝试使用它：

t<itemProps[]>('websites',{returnObjects: true}).map(({slug,name}: itemProps) => ( ... ))

这告诉TypeScript t将返回itemProps的数组。

---

我想知道我是否只为.map

下划线

几乎永远不要抑制TypeScript的编译器错误。但是，如果确实需要，可以在上面的行中使用// @ts-ignore。

,

@cherryblossom的答案是正确的-我正在发布新的答案，以帮助提供更多细节。

这是基本的i18n t函数的类型定义（供您的代码使用）：

  <
    TResult extends TFunctionResult = string,TKeys extends TFunctionKeys = string,TInterpolationMap extends object = StringMap
  >(
    key: TKeys | TKeys[],options?: TOptions<TInterpolationMap> | string,): TResult;

这是一个通用函数，可以将TResult，Tkeys和TInterpolationMap作为选项。 如我们所见，在没有任何类型参数的情况下，TResult默认为“字符串”。

字符串类型没有.map函数，因此会出现错误。

由于您确定应该返回项目数组，因此需要显式指定TResult类型参数，例如指示的@cherryblossom：

t<itemProps[]>('websites',{returnObjects: true}).map(...)

顺便说一句，在解决此类问题时，正在使用的库的类型定义非常有用。对于此类情况，请务必先进行检查。