时间戳

首页 > 解决方案 > 选择器连接多个组件，是否保证父组件先更新？

reactjs - 选择器连接多个组件，是否保证父组件先更新？

问题描述

我的组件 Parent 和 Child 如下：

const Parent = ({ valueFromSelector }) => {
  if (valueFromSelector === undefined) return null;

  return <Child />;
}

const Child = ({ valueFromSelector }) => {
  return <span>`i am unsafely using ${valueFromSelector.property}`</span>
}

是valueFromSelector.property不安全的使用，还是我可以确定 Child 永远不会更新/渲染，如果因为valueFromSelector在 Parent 中受到保护？

基本上我要问的是，是否保证选择器按“顺序”从父组件更新到子组件。

标签： reactjsreselect

解决方案

简而言之，不幸的是，选择器不能保证按“顺序”从父组件更新到子组件。在某些条件下可能会出现问题。

这个问题被称为僵尸孩子，redux 版本 6 试图解决这个问题，但不幸的是 Context API 在性能方面无法完全支持 redux。所以他们不得不在版本 7 中恢复该更改，并且没有办法防止功能组件出现问题。

这里有一些文章可以更详细地回答您的问题：

https://kaihao.dev/posts/Stale-props-and-zombie-children-in-Redux

https://react-redux.js.org/api/hooks#stale-props-and-zombie-children

推荐阅读