Javascript 为什么我的redux选择器工作不正常？

我试图理解重新选择，但到目前为止失败了。我知道它们是为了性能等而存在的。如果该组件没有发生状态更改，是否应该停止调用MapStateTops

我有这个组件

const mapStateToProps = ({ data: { complete } }) => ({
    isComplete: complete,
})

每次状态更改都会调用它，我只希望在状态从false更改为true时调用它

所以我试过这个

const checkIfIsComplete = () => createSelector((state, props) => props.data.complete)

const mapStateToProps = () => {
    const getIsComplete = checkIfIsComplete()
    return (state, ownProps) => {
        return {
            complete: getIsComplete(state, ownProps),
        }
    }
}

但是，此错误正在破坏：

无法对未安装的组件执行React状态更新。

---

如何修复此组件，使其仅在需要时调用MapStateTops并始终返回正确的值？

否，您误解了

mapState

的工作原理<代码>映射状态将始终在根状态发生更改时调用

在这里记忆选择器的要点是，如果组件关心的状态没有更改，则确保

mapState

返回相同的值，因为

connect

使用返回值的粗略比较来决定组件是否应重新渲染

---

有关如何正确使用

mapState

的指导，请通读。我在上的帖子讨论了为什么以及如何使用重新选择。

您可以创建如下选择器：

const selectData = state => state.data;

const selectIsComplete = createSelector(
  selectData,
  (data) => data.complete
)

const mapStateToProps = createSelector(
  selectIsComplete,
  //only create a new object with complete property
  //  if complete changes
  complete=>({complete})
)

---

如果ownProps发生更改，组件仍将重新渲染，但如果它没有ownProps，则只有在完全更改后才会重新渲染。

感谢您的回复。如果我想在mapStateToProps中执行一些逻辑，本文只给出了一个示例，而MapStateTops实际上不应该存在。重选如何适用于我的简单示例？我不确定您在这里问的是什么问题。根据您最初的问题“如何修复此组件，使其仅在需要时调用MapStateTops并始终返回正确的值？”，这是对

mapState

的错误理解。你不能阻止它被呼叫，这就是重点。它将被称为。您的工作是返回此组件所需的数据，并让

connect

在数据发生更改时进行检测。选择器通过跳过转换并返回相同的引用（如果合适）来优化它。对不起，让我更清楚一些。我理解MapStateTops每次都会被调用，但您链接的第二篇文章似乎谈到在MapStateTops中执行昂贵的逻辑。对我来说似乎是一种反模式，这种逻辑无论如何都不应该存在。其次，我想要一个我可以遵循的例子，这样我就可以理解发生了什么，所以我想把console.logs放在某个地方，看看选择器对代码有什么影响。我猜选择器会在第一次获取值时呈现，然后每次缓存它，直到它获取新值。我的示例只是从状态中获取一些数据并返回true或false。那里没有奇特的地图。据我所知，mapStateToProps永远不应该执行映射逻辑。这应该在组件中完成，然后像这样更新状态“昂贵转换”的示例非常简单，如映射项ID列表以从规范化状态返回实际项列表。每次调用时都会创建新的数组引用。（或者计算起来可能非常昂贵。）关键是，您只希望在输入值实际发生更改时运行该逻辑，但

mapState

仍需要返回当前正确的值，以便在组件中使用，因此记忆选择器可以帮到您。太好了！我要试一试。我如何衡量或看到绩效有所提高？我可以将日志放在某个地方并计算重新渲染的次数吗？@RedBaron您可以将控制台日志放在组件的渲染部分，并使用名为

*Profiler