请教一个有关 react state 设计和使用的问题:如何更新了 state,但不触发页面更新,直到下一次重新打开网站?

2020-10-26 16:41:47 +08:00
 yazoox

技术用的是 react, react-redux, and react-saga 那一套。

现在要做多语言支持,所以,用户设置里面有一项,语言设置 language settings. 默认是当前浏览器的语言 locale 。但是用户可以修改成自己想要使用的任何语言,比如 日文,俄语,中文,等等。

问题来了,在 settings 页面,用户选择了自定义的 locale 后,这个值我们是会保存下来的,是会更新 state 状态的,然后页面就刷新了。而且,刷新是多个页面刷新,不仅仅是当前设置页面。可是,我们不想这样,而是保持不变。直到用户下一次打开网站,重新加载时,发现 locale 使用了自定义的,然后使用新的语言。(因为有些功能,必须网站重新打开,初始化时加载,其它语言,才能够成功,也就是说,即使实时刷新页面,这个刷新是不完整的,可能会出问题)

想过添加一个临时的 flag,如果修改了语言设置,则设置为 1. 然后 react 刷新时,如果发现为 1,语言不变,还是上次的(那还得有添加一个 readonly 的 state,记录网站打开时的那个语言)。而且,state 的是 react engine 自动刷新的,没有太好的办法控制它。

特来请教一下大家,有没有比较成熟 /合适的方法。

2124 次点击
所在节点    React
10 条回复
murmur
2020-10-26 16:42:51 +08:00
那为什么要用 state 呢,做成常量不好么,每次更新只在后台变更配置,做成 state 就是要联动更新
shintendo
2020-10-26 16:43:50 +08:00
缓缓打出了一个问号
vision1900
2020-10-26 16:47:34 +08:00
SPA 怎么做到多页面的,在线等
yhxx
2020-10-26 16:50:16 +08:00
语言存个 localstorage 不行吗?
source
2020-10-26 17:01:31 +08:00
cookie,localstorage,你需要持久化存储,跟 react 跟框架没有任何关系,你写 jq 也是这个思路来实现
source
2020-10-26 17:02:49 +08:00
详细一点就是,i18n 配置存在 localstorage 里,页面 init 的时候读取 localstorage 中的语言配置就完事了
996icu007007
2020-10-26 17:10:18 +08:00
@vision1900 多页面打包吗? 配个 webpack entery 啊 网上搜多的是
acfe
2020-10-26 18:05:28 +08:00
用 localstorage 啊,或者把 locale 字段存到数据库里,下一次打开,再去调接口拿这个字段
GzhiYi
2020-10-27 09:10:56 +08:00
单纯的 state 是没法持久化的
baxtergu
2020-11-12 11:47:32 +08:00
把语言切换的状态做成持久化的,只在加载应用的时候读取一次然后递给应用最外层的 Provider 。

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/718740

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX