如何保持设置的语言

来源：11-11 【redux-persist】登录持久化

幕布斯8089534

2021-12-04

老师，我想尝试实现刷新页面或者重新打开页面能记住之前设置的语言
我在 store.ts 的 persistConfig 的 whitelist 里面加入了 language：

图片描述

把语言选成英文后刷新页面，看到 localStorage 里面记录的是 en，button 的文字是 English，但是页面的文字是中文：
图片描述

我想了一下，感觉是 i8n 默认配置是 ‘zh’，i18n.changeLanguage(action.payload); 放在一个自定义的中间件里面，只有在 dispatch action 时才有可能被调用，但是 changeLanguage 的 action 只有点击 Menu.item 才会被触发。导致刷新页面时虽然 language 被记住但是没有 i18n 的语言配置还留在 'zh‘。
图片描述

我看 doc 上写如果有 language detector，语言的配置可以省略，所以这个功能需要借由其他的插件实现吗？
图片描述

写回答

2回答

王鹳厶

2022-11-30

// 使用 @reduxjs/toolkit 语法糖, 转换过程中页面会闪一下, 因为走生命周期
useEffect(() => {
 dispatch(languageSlice.actions.changeLanguage(language))
}, [])

阿莱克斯刘

2021-12-07

启用language detector需要安装相关的插件，可以试试

i18next-browser-languagedetector

https://github.com/i18next/i18next-browser-languageDetector

但我不是很确定你的问题是不是language detector所引发的，我感觉更像是redux的问题，似乎是redux没有处理i8next的副作用所造成的，这个部分可能需要进一步研究一下。

React18 系统精讲结合TS打造旅游电商平台

React18 精讲 + 结合 TS 实战 + 热门业务开发，获取必备技能

1993 学习 · 1015 问题

查看课程

相似问题

用useEffect来控制subscribe订阅时，切换语言无法触发卸载时的处理

回答 1

语言包迭代问题

回答 1

关于语言切换

回答 1

老师如果使用了redux架构那么所有数据都应该存在store里么？

回答 1

为什么课程要关闭any检测不强制统一不允许取消这种没必要的选择权会导致规范不统一

回答 1

打开慕课网App查看更多内容