Question

我是React的新手。

Scenerio：

Redux State有：X，Y，Z对象：

    class A {
          render(){...}
        }

    mapstatetoprops(){
        return { X: x1}
    }

connect(mapstatetoprops)(A)

我在某处读到，当在X，Y或Z中更改redux状态时，连接调用mapstatetoprops会重新呈现组件A.

但是，我只想在X被更改时重新呈现A.这可能吗？

Answer 1

我在某处读到，当在X，Y或Z中改变redux状态时，连接调用mapstatetoprops重新呈现组件A.

这种说法部分正确。 Redux状态的更改将触发对mapStateToProps()的调用（假设它不是deep-nested state change）。但是，render()只有在props或状态通过setState()（Link）进行修改时才会被调用。

因此，如果您的Redux状态发生变化，则只会调用render()，具体取决于您在mapStateToProps()中执行的操作。

Answer 2

我认为这是解释问题的最佳来源

查看官方文档以获取更多信息https://redux.js.org/docs/faq/ReactRedux.html

为什么我的组件没有重新渲染，或者我的mapStateToProps正在运行？直接意外地改变或修改您的状态是组件在调度操作后不重新渲染的最常见原因。 Redux希望您的Reducer将“不可变”地更新其状态，这实际上意味着始终制作数据副本，并将更改应用于副本。如果从reducer返回相同的对象，Redux会假定没有任何更改，即使您对其内容进行了更改。类似地，React Redux尝试通过对shouldComponentUpdate中的传入props进行浅等式引用检查来提高性能，如果所有引用都相同，则shouldComponentUpdate返回false以跳过实际更新原始组件。

重要的是要记住，每当更新嵌套值时，您还必须在状态树中返回其上方的任何内容的新副本。如果您有state.a.b.c.d，并且想要对d进行更新，则还需要返回c，b，a和state的新副本。此状态树变异图演示了树中深层变化如何需要一直变化。

请注意，“不可更新地更新数据”并不意味着您必须使用Immutable.js，尽管这当然是一种选择。您可以使用几种不同的方法对普通JS对象和数组进行不可变更新：

使用Object.assign（）或_.extend（）等函数复制对象，以及slice（）和concat（）等数组函数 ES6中的数组扩展运算符，以及为未来版本的JavaScript提出的类似对象扩展运算符将不可变更新逻辑包装成更简单函数的实用程序库

如何根据mapstatetoprops返回的对象渲染组件？

2 个答案: