Reactjs 当值属性更改时,提供程序的所有使用者都将重新呈现?
我试图更好地理解React上下文API。在react中,我偶然发现了这一段: 作为提供程序的后代的所有使用者都将重新呈现 每当提供者的值属性更改时。传播 提供给其后代使用者(包括.contextType和 useContext)不受shouldComponentUpdate方法的约束,因此 即使祖先组件跳过更新,消费者也会更新 我很难理解这一点,因为我对消费者的定义有点不清楚。如果我尝试创建一个示例,结果总是一样的:如果值更改,则提供者的所有子项(而不是使用者)都将重新加载。Reactjs 当值属性更改时,提供程序的所有使用者都将重新呈现?,reactjs,react-context,Reactjs,React Context,我试图更好地理解React上下文API。在react中,我偶然发现了这一段: 作为提供程序的后代的所有使用者都将重新呈现 每当提供者的值属性更改时。传播 提供给其后代使用者(包括.contextType和 useContext)不受shouldComponentUpdate方法的约束,因此 即使祖先组件跳过更新,消费者也会更新 我很难理解这一点,因为我对消费者的定义有点不清楚。如果我尝试创建一个示例,结果总是一样的:如果值更改,则提供者的所有子项(而不是使用者)都将重新加载。 我很想理解上面这段
我很想理解上面这段话的意思。是否存在上下文值更新而不触发其子级(最好是在函数组件中)的新呈现的情况?根据您的沙盒,问题在于主应用程序组件中的状态管理方式
//your useState
const [store, setStore] = React.useState([]);
//the button that is setting the state
<button onClick={() => setStore([])}>Reset store value</button>
//您的useState
const[store,setStore]=React.useState([]);
//设置状态的按钮
设置存储([])}>重置存储值
这会导致组件中的状态更改,从而重新启动应用程序组件本身,从而重新启动其所有子组件。如果只希望更新上下文状态,则应避免将值存储在状态中,而应直接让逻辑更改值对象中的属性。好的,看起来确实如此。但在这种情况下,我认为react文档在这里是错误的。对我来说,消费者并不意味着“所有的孩子”。@Xen_-mar它暗示了这一点。毕竟,当你渲染一个组件时,它确实需要为所有子组件调用渲染函数(除非他们选择退出,例如,
shouldComponentUpdate()
或React.memo
)。谢谢@AKX-我仍然认为这不完全正确。对我来说,消费者将是使用useContext
或
的组件。对我来说,这段话意味着价值的改变只会更新消费者和他们各自的子树。这意味着组件将与其提供商建立订阅关系,而不是基于道具的关系。嘿,我已经弄明白了为什么会出现这种情况,将编辑答案编辑了答案