i18多语言翻译插件使用

引入

import { useTranslation ,Trans} from "react-i18next";
const { t } = useTranslation();

翻译

t('')

更新语料库

package.json中script添加

"downloadLocales": "locize download --project-id=xxx --ver=latest --clean=true --path=./public/locales",

然后每次启动项目前

yarn downloadLocales

插值使用

//语料库中更新：
xxxx {{key}} xxxxx
//代码中传参：
t('',{key:value})
//指定哪个语料库
t('',{ns:'utils'})

标签嵌入

需要注意当在语句的头部插入标签会导致翻译不出头部的内容，标签需要插入在语句中间

//在语料库中：
<1>xxxx</1>   //使用<1>作为占位符
代码中使用
<Trans i18nKey="prop">
    xx<Box sx={{color:'red'}}>Subscriptions</Box>xx
</Trans>