从 fetch 中获取数据而不是将其存储在 state 中答案

【问题标题】：Getting data from fetch and not storing it in state从 fetch 中获取数据而不是将其存储在 state 中
【发布时间】：2016-05-20 15:02:47
【问题描述】：

我们有一个 React/Redux 应用程序，您可以在其中更改应用程序的语言并使用 fetch 从 API 获取所有字符串。将所有字符串存储在 state 中似乎是个坏主意，只将语言（en、es 等）存储在 state 中，而将字符串存储在其他地方似乎更好。

那么有没有办法保存从 API 调用中获取的数据而不是将其保存在状态中？

【问题讨论】：

你对请求有完全的控制权，也许你会使用像fetch(myRequestParams).then(fetchRes => filterData(fetchRes))这样的东西并使用这种承诺的结果？您如何处理服务器请求？
请求是使用 isomorphic-fetch 库完成的。并在 filterData(fetchRes) 中将其保存在全局中，以便我可以在任何地方访问数据？
但是你如何自己触发请求呢？我的意思是，您是否在反应组件生命周期钩子上触发请求，使用 thunk-middleware 或任何其他类型的东西？没有 the only right 可做的事情，您可以根据需要调整 api 请求的结果并将它们存储在应用程序状态树中（或不存储）。
实际上，在 componentWillMount 上，当用户想要更改语言并将接收到的数据保存在状态时，我会加载默认语言字符串（或以前登录的首选语言字符串）或使用 thunk 中间件触发异步操作。
那么为什么不把过滤代码放到这个thunk函数中呢？您可以触发请求、收集数据、过滤它，然后才将操作发送到您的商店。

【解决方案1】：

如果您不想使用商店，则不应使用操作来获取数据。

您可以将翻译存储在其他地方，然后从状态中引用它们。如果你决定走这条路，最简单的选择是不使用 store 并在 redux 之外获取翻译（即不采取任何行动）。

另一种选择是将翻译存储在状态中。你可能不喜欢它，但它是完全可行的。将所有状态存储在一个对象中有其好处（时间旅行、调试等）。

我认为在这种情况下没有明确的界限。

【讨论】：

将所有翻译存储在状态中，有点打破了 Redux 拥有尽可能小的状态的想法。用高阶组件包装组件并在上下文中提供翻译呢？那么有没有办法让我从一个动作中改变上下文本身？
我认为你是对的。 Redux 是关于存储状态，而不是数据。但是，您可以将语言选择存储在商店中（即{..., language: 'en_EN'}）。渲染组件时，您可以引用外部翻译对象myTranslationObj[this.props.language].title。所以上下文被保存在 store 中，因为它原来是 real 状态。