在数据文件中使用 next-i18next 翻译

Question

我在 Next.js 应用中使用 next-i18next 库进行翻译。

它被设计为使用大量数据文件，这些文件导出原始数组和对象。现在，我不确定如何将我的翻译放在那里。

让我们考虑这个简化的例子：

export const fruits = [
    'Green apple',
    'Yellow banana',
    'Sour lemon',
    'Red grape',
];

我正在将此文件导入我的模板并显示它：

<ul>
    {fruits.map(fruit => <li>{fruit}</li>)}
</ul>

在现实生活中，这些数据文件要复杂得多，因此调整模板以使用来自那里的翻译将花费很长时间。此外，模板中的许多组件使用来自这些文件的数据作为动态属性。所以为了避免这种重构的噩梦，我想做这样的事情：

import { useTranslation } from 'next-i18next';

const { t } = useTranslation('fruits');

export const fruits = [
    t('greenApple'),
    t('yellowBanana'),
    t('sourLemon'),
    t('redGrape'),
];

当然不能这样做，因为钩子不能在功能组件之外使用。有没有办法在像这样的原始 JavaScript 文件中使用翻译？