reactjs 在静态文件中使用i18next

nqwrtyyt  于 2023-04-29  发布在  React
关注(0)|答案(2)|浏览(166)

我在我的移动的项目中使用i18 next和redux-toolkit,
我得到了菜单列表静态数据,它就像这样。

const menuListData = [
 {
      id: 1,
      titleT: 'title1',          
  },
  {
      id: 2,
      titleT: 'title2',   
  },  ];
 export default menuListData;

只是id和标题,我得到了语言存储,lang文件这样

export default en = { // also got for another lang
    translation: { 
      "title1": 'Title 1', 
      "title2": 'Title 2', 
    }
  }

我只是想在这样的静态文件中使用i18 n翻译,但它给出了错误

import { useDispatch, useSelector } from "react-redux";
import React from "react";

const MenuList = (props) => {
    const i18n = useSelector((state) => state.langStore.i18n);
}
const titleTranslate = (metin) => {
    const i18n = useSelector((state) => state.langStore.i18n);
    return i18n.t(metin);
}
const menuListData = [
    {
        id: 1,
        titleT: i18n.t('title2'),
    },
    {
        id: 2,
        titleT: i18n.t('title2'),
    },
];
export default menuListData;

我怎么办,谢谢
我做了刚刚和导出文件

const getMenuListData = (t) => [  
  {
    id: 1,
    titleT: t('title1'), 
  },
  {
    id: 2,
    titleT: t('title2'),  
  },    
];

export const data = getMenuListData;

然后我称之为它的组件,我把它交给了i18 n。我不像她那样坚强

import { data } from "./menuListData";
 //in function
  const menuData = data(i18n.t);

那就行了,谢谢大家

7tofc5zh

7tofc5zh1#

我只是想在这样的静态文件中使用i18n翻译,但它给出了错误
你会得到错误,因为在文件的全局范围内没有i18n.t函数。
您可以将menuListData变量转换为函数e。例如getMenuListData,并将translate函数作为 argument 传递给它。

const getMenuListData = (t) => [
    {
        id: 1,
        titleT: t('title2'),
    },
    {
        id: 2,
        titleT: t('title2'),
    },
];

然后,就叫它里面的e。例如MenuList组件:

const MenuList = (props) => {
   const i18n = useSelector((state) => state.langStore.i18n);
   
   const data = getMenulistData(i18n.t);
}
daupos2t

daupos2t2#

const getMenuListData = (t) => [  
  {
    id: 1,
    titleT: t('title1'), 
  },
  {
    id: 2,
    titleT: t('title2'),  
  },    
];

export const data = getMenuListData;

然后我称之为它的组件,我把它交给了i18n。我不像她那样坚强

import { data } from "./menuListData";
 //in function
  const menuData = data(i18n.t);

相关问题