我了解到,一个Context.Provider重新呈现其子Context.Consumer组件时的 上下文值 的Provider规定变化。
Context.Provider
Context.Consumer
Provider
官方文件进一步证实了这一点:
只要提供商的价值支柱发生变化,作为提供商的后代的所有消费者都将重新渲染。
尼古拉斯还帮助我理解,Provider知道 上下文值 是否已更改的唯一方法是其包围组件是否重新渲染。
综上所述:
Providers``Consumers
因此,上面(1)中的功能似乎是多余的。如果Provider仅Consumers在其包围组件重新渲染时才更新,并且只有在父级重新渲染时才可以发现 上下文值 更新,所以不需要具有允许在 上下文值 更改时Provider更新的功能。Consumers __
Consumers
我在这里想念什么?
编辑
尼古拉斯在评论中还说:
应用程序可以(可以想象)由于与上下文无关的事情而重新渲染。如果发生这种情况,您不希望消费者重新提交。为此,您需要通过===检查之前的值和之后的值。如果要提供对象,则意味着您无法在App的render方法中创建全新的对象,否则最终将不必要地重新渲染使用者。
但是,我给人的印象是,当父母重新渲染时,其 所有 孩子也会重新渲染。因此,上述===支票将无济于事,即孩子们无论如何都会重新汇款。
===
3)导致提供者及其所有后代重新渲染
尽管这是默认行为,但在实践中通常会更改此行为以提高性能。纯组件,实现shouldComponentUpdate的组件或使用React.memo的组件将导致重新渲染在遍历整个树之前停止。
例如:假设存在一个处于某种状态的顶层组件,该组件呈现一个具有的中层组件shouldComponentUpdate() { return false; },该组件具有一个呈现底层状态的组件。在初始安装时,所有这三个都将渲染。但是,如果顶级组件更新其状态,则仅顶级组件将重新呈现。中级组件由于其shouldComponentUpdate而将被跳过,因此甚至从不考虑底层组件。
shouldComponentUpdate() { return false; }
现在,我们在顶级组件中添加上下文提供程序,并在底层组件中添加上下文使用者。在初始安装时,它们将再次全部渲染。如果顶级组件更新其状态,它将重新呈现。由于其shouldComponentUpdate,中级组件仍将跳过其渲染。但是,只要上下文值发生变化,即使上级组件被保释,底层组件也将重新呈现。这就是该Blur所引用的功能。