Reactjs parrent重新渲染，但它的孩子赢了会是什么情况'；T

我被告知，如果父对象的道具发生变化，但父对象的状态发生变化，则子对象不会重新渲染

在下面的例子中，当我单击按钮时，子对象重新渲染，这是有意义的，因为它的父对象的状态已被触发，但我不知道为什么孙子对象也会重新渲染！！它的父状态（子状态）没有改变

那么，这里的规则是什么

情况如何：

import React, { useState } from "react";

const App = () => {
  const [text, setText] = useState(0);
  return (
    <div style={{ padding: "50px" }}>
      <button onClick={() => setText(text + 1)}>add</button>
      {text}
      <Child />
    </div>
  );
};

const Child = () => {
  console.log("child");
  return (
    <div>
      <Grandchild />
    </div>
  );
};

const Grandchild = () => {
  console.log("Grandchild");
  return <div>:))</div>;
};

export default App;

1）应用程序渲染，但没有子对象和孙子对象渲染？

2）应用程序渲染，但只有子对象渲染而没有孙子对象？

顺便说一句，我不是指如何使用Memo或pureComponent，我只是想知道React如何呈现嵌套的子级：）

import React，{useState}来自“React”；
常量应用=（）=>{
const[text，setText]=useState（0）；
返回(
setText（text+1）}>添加
{text}
);
};
常量Child=（）=>{
console.log（“child”）；
返回(
);
};
常量孙子=（）=>{
控制台日志（“孙子”）；
退货：）；
};
导出默认应用程序；

简而言之，如果其父级重新呈现，则SFC（无状态功能组件）始终会重新呈现

更改

应用程序

组件中的状态会导致

子组件

重新渲染。与

孙体

相同，因为它的父体（

子体

）已重新渲染

但是，如果将

子级

转换为类并使用

React.PureComponent

，则不会重新渲染，因为没有传入任何道具（没有道具或状态被更改）<代码>孙辈也不会重新渲染

PureComponent

进行浅属性比较，这将避免过度重新渲染

顺便说一句——“我被告知，如果父母的道具发生变化，孩子们不会重新渲染，但如果父母的状态发生变化。”——那不是真的。即使父组件的状态更改，也可以避免子组件的重新渲染