问题标签 [reselect]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
3 回答
5485 浏览

reactjs - 使用重新选择计算派生状态时如何避免 React 重新渲染

我在我的应用程序中使用了 React + Redux + Reselect + Immutable.js 的终极组合。我喜欢重新选择的想法,因为它让我的状态(由减速器维护)尽可能简单。我使用选择器来计算我需要的实际状态,然后将其提供给 React 组件。

这里的问题是,reducer 中的一个小变化会导致选择器重新计算整个派生输出,结果整个 React UI 也会更新。我的纯组件不起作用。它很慢。

典型例子:我的数据的第一部分来自服务器,基本上是不可变的。第二部分由客户端维护,并使用 redux 操作进行变异。它们由单独的减速器维护。

我使用选择器将这两个部分合并为一个记录列表,然后将其传递给 React 组件。但很明显,当我更改其中一个对象中的单个内容时,会重新生成整个列表并创建 Records 的新实例。并且 UI 完全重新渲染。

显然,每次运行选择器并不是很有效,但仍然相当快,我愿意做出这种权衡(因为它确实使代码更简单、更干净)。问题是实际渲染速度很慢。

我需要做的是将新的选择器输出与旧的深度合并,因为 Immutable.js 库足够聪明,不会在没有任何更改时创建新实例。但由于选择器是无法访问先前输出的简单函数,我想这是不可能的。

我认为我目前的方法是错误的,我想听听其他想法。

在这种情况下,可能要走的路是摆脱重新选择,并将逻辑移动到减速器的层次结构中,这些减速器将使用增量更新来维护所需的状态。

0 投票
0 回答
1206 浏览

reactjs - 如何正确使用带有 Redux 存储和路由的 observable

使用Redux 中的真实示例,最好在哪里定义一个可观察的,然后在Redux商店中定义侦听器?例如,从这个 Redux 讨论线程中,当使用redux-rx时,以下代码应该放在实际示例中的什么位置?

我最初认为我会在容器/App.js 中定义它,但在那个级别,redux 存储不可用,就像它在 index.js 和容器/Root.dev.js 中一样。也许以某种方式利用 React上下文?如果这有什么不同,我正在为我的呼叫使用重新选择选择器。connect()

0 投票
2 回答
400 浏览

javascript - 如何/在哪里从 redux 应用程序中的服务器转换日期?

我现在开始研究redux。我以实际示例为起点,使用 normalizr 和 reselect 来处理数据。

现在,我需要了解将来自服务器的日期转换为 js Date 对象的最佳位置在哪里。由于 normalizr 已经处理了“一些模式”,我认为它也可以做到这一点,但我没有在那里找到它。

我应该在哪里转换这些日期?我的假设是我必须保留那些已经在商店中转换的日期。那正确吗?

0 投票
1 回答
13095 浏览

reactjs - 如何在 redux 上使用 reselect 获得 ownProps?

我想使用基于某些ownProps.mapStateToProps

0 投票
2 回答
693 浏览

javascript - 当我想对数据进行排序或过滤时,如何查看 redux 容器中的数据状态?

我有一些数据作为对象数组。我会用 redux 和 react-redux 对其进行排序或过滤。

我的初始状态

由于过滤和排序是针对 UI 的,所以我尝试在容器(智能组件)中实现它。过去几天我在阅读 redux,react-redux 的文档,发现我需要使用reselect。因此,我创建了两个选择器:存储最新排序数据数组的sortData和存储最新过滤数据数组的filterData

选择器的参数 - 选择器监视的字段

排序数据

过滤数据

正如您在上面看到的,我的选择器filterData依赖于sortData而不是相反。当我 filterData 它只调用过滤器计算但是当我尝试对数据进行排序时它同时调用排序和过滤器。

我的mapStateToProps

当我单击“过滤数据”时,我想过滤最新的排序数组,当我单击“排序数据”时,我想对最新过滤的数组进行排序。 我的问题:

  1. 如何在不重新计算的情况下实现此功能?
  2. 我可以在不重新选择的情况下实现它吗?

PS 我阅读了 Dan Abramov 的示例,但不幸的是,我无法将其应用于解决我的任务。更多代码:在此处输入链接描述

0 投票
0 回答
171 浏览

javascript - 重新选择问题。如何知道选择器中的某些参数已更改

重新选择允许我们记住一些数据并在选择器更改时更新它们。我有 2 个参数,并且取决于哪个参数,被更改返回确定的结果。

我可以实施吗?

0 投票
1 回答
1258 浏览

javascript - 重新选择总是重新渲染

我正在尝试将重新选择添加到我的反应代码中,但它似乎总是在重新渲染。

每次我改变我的状态时,即使输入选择器没有改变,控制台也会打印“测试”。我创建了一个简单的测试来向你们展示发生了什么。

我究竟做错了什么??我一直在重新阅读文档,据我所知,console.log 在第一次之后不应该运行,因为输入选择器没有改变。我理解正确吗?

0 投票
0 回答
103 浏览

android - onTabReselected android时重新加载片段

我有一个 TabNews extent extends Fragment 当重新选择这个选项卡时,我想重新加载这个选项卡,怎么办?

0 投票
1 回答
239 浏览

javascript - redux reselect 不断重新计算

我有这个项目列表,每个项目在单击时都会将 state.ui.clickedItem 更改为单击的项目本身。我想计算项目的关联分配记录。

所以我有这个重新选择选择器:

我认为记忆化将使行为能够:

用户单击项目 A --> 相同的 Assignments 不可变数组 && 在项目 ID 之前从未见过 --> 计算项目的分配和 console.log

用户点击 B 项 --> 同上

用户单击项目 A(再次)-> 之前看到的相同分配数组 && 项目 ID-> 没有计算,只需从缓存中获取它并且没有 console.log

这就是我所期望的,但是,我得到的是每次点击都会重新计算过滤和 console.logging。任何人都可以在我的重新选择代码中看到任何错误吗?

谢谢!

0 投票
2 回答
596 浏览

javascript - 将 denormalizr 与重新选择相结合是一种好方法吗?

我将reselectdenormalizr一起使用,以避免对每次更改进行非规范化,但我真的不知道这是否真的在改进某些东西。