问题标签 [reselect]

我对 react 和 redux 很陌生，我遇到了问题。

注意：我需要稍后描述的流程，因为我的应用程序有一个在服务器上“处理”的动态菜单。

在Login屏幕后的应用程序中，我显示了一个Dashboard加载数据的组件（以异步方式）：

Dashboard 的渲染方法很简单：

现在，LeftNavigation组件的状态与 react-redux 相关联：

在完成加载并触发操作以更新状态之前，该属性systemTypes为空。this.props.loadAllSystems();

getSystemsTypes写的是reselect：

如您所见，为了解决这个问题，我添加了对 systems.length 的检查以避免 Object.keys 上的错误。

以这种方式应用程序可以工作，但是这是正确的还是我做错了什么？

我没用过redux-thunk，我正在用，redux-saga但我想这不是问题。

我使用 reselect 来获取我的部分 redux 状态。我有一个我所在州的对象列表。我的创建选择器的子选择器之一是此列表的过滤器功能：

所以我将它传递给我的 createSelector：

此过滤器函数返回列表中我的对象的子集。因此，如果列表发生更改，即使子集没有更改，重新选择也始终返回一个新对象，因为列表不一样（完全正确）。

如果对象或过滤列表发生更改，是否有可能只获得一个新对象？

在我的应用程序中，我有许多仅在用户登录时才有意义的状态部分。

当用户登录并直接导航到页面时，路由器会显示该页面但必须进行异步调用，因此尚未填充状态的一部分。

现在，假设我必须在导航栏上显示一个按钮，该按钮必须占据状态的一部分，但是自从异步调用完成后，这个状态就没有被填充。

更实用的是，我有这个选择器：

有了这个就没有问题了，因为selectedCustomer是initialStatereducer的一部分

问题出在这个选择器中：

entities状态的一部分initialState是一个空数组，将在异步调用时填充。

因此，当应用程序启动并且我映射（使用 connect - mapStateToProps）选择器时，getSelectedCustomerName我收到错误，因为entities它是空的并且可以肯定，customer字段不存在

如果采取一些简单的解决方案if-else，但我将不得不在应用程序的“每个”部分执行此操作。

我在问是否有更好的解决方案来避免这种情况......

如何使用normalizr来处理通过标准关键的嵌套标准化JSON API响应{ data: ... }？

例如一个Book

我将如何设计模式来处理嵌套数据键？

我刚刚从服务器获取了一些原始数据，之后我需要解析数据，然后再将它们呈现在组件上。

那么我应该把解析数据的代码放在哪里呢？在减速器中还是在动作中？我觉得应该放在reducer里面，这样合适吗？

我正在使用 Redux 和 ImmutableJS 来管理我的应用程序的状态。我创建了以下两条记录：

我的全局状态基于 normalizr 方法进行标准化，如下所示：

• 我将此规范用于测试目的。

现在我正在尝试使用 Reselect 对计算字段进行一些选择。

，但我收到以下错误消息：

错误：无法在记录中设置未知键“productName”

我知道原因 - 记录不能包含任何未定义的键，但我的问题是：是否有任何建议的方法如何优雅地解决这个问题？

• 我不想扩展我的记录来支持这种计算参数（product.name 和 totalPrice）。
• 我不想将静态参数和计算参数保存在一个地方，因为例如“productName”参数来自“Product”实体而不是“Order”实体。

谢谢你。

我正在使用React Reselect并且我正在尝试过滤 selectedClients 以便我只返回具有 selectedClientsIds id 的 clients.all。

selected_clients.js

clients.all 商店如下所示：

selectedClientIds 存储如下所示：

我如何将两者结合起来仅显示具有来自 selectedClientId 的 id 的客户端列表？使用上面的过滤器，我不断得到一个空数组

我有以下代码：

select.js：

viewController.js：

我的状态从

至

我使用backNavSupportedin AppView，但是当我检查状态更改backNavSupported 后false的值时，我得到了 ，这对我来说很有意义......

我错过了什么？

更新

这就是我在组件中使用它的方式（可能是范围问题？）：

Right now I'm using reselect to create my selectors to extract data from the store and pass it to the props via connect. For simplicity, the result of my selectors is always a JS object (calling toJS() at the end of the selector), something like this:

Now I'm trying to improve some performance and I realized that shouldComponentUpdate shallow comparison loses the advantages of immutability because of the way I'm returning from my selectors.

On the other hand, using .get('prop') inside my html seems extremely annoying:

Especially if I have a case of passing a simple JS object to a child component which is mutable, like this:

And then there is no consistency when accessing the props (some are mutable and some are immutable).

I thought of creating an helper unwrap function, something like this:

But I don't really like this solution.. I don't really like any of those approaches.

What do you use for both clean code & performance?

在 redux 应用程序中，使用 connect 从 state 中获取数据是要走的路。问题是我发现自己将组件与状态原子紧密耦合。如果我想更改状态树的结构，所有用于消耗这种状态的组件都会中断。

那么如何将它们解耦呢？

例子

在这个简单的状态下，我描述我有 2 个用户和 2 个帖子，两个帖子对两个用户都是可见的。

在列出帖子和用户的组件中，连接可以是

这里的问题是组件的渲染函数对状态进行了大量操作以渲染正确的数据。如果我能做类似的事情会更好

我如何创建这样的对象来处理状态并公开组件和连接函数联系以获取信息的 api。

我读了很多关于重新选择的内容，但是如何实现呢？