react.js - 父子组件都使用memo，兄组件切换显示，弟组件重新渲染，memo为啥失效？

Question

父组件：

<div className={'myScreenDetail'}>      {isView && <ImageView imgUrl={imgSrc} setIsView={setIsView} />}      <ImgShow />    </div>

子组件：

<ImgShow /> useEffect(() => {    console.log('渲染了');  }, []);

父组件和子组件都是用了memo:,切换isView，理应ImgShow组件不重新渲染，但是isView切换，都会打印“渲染了”，memo感觉失效了，这是为什么啊？求大佬指教

Answer 1

请把 App 组件内部定义的其他组件全部提取出去 单独定义，因为 app更新 这些函数都会重新定义

import "./styles.css";import { memo, useEffect, useState } from "react";export default function App() {  const [isView, setIsView] = useState(false);  useEffect(() => {    console.log("渲染1");  });  return (    <div className="App">      <ImgShow setIsView={setIsView} isView={isView}/>    </div>  );}const Test = memo(() => {  useEffect(() => {    console.log("渲染2");  });  return <div>测试1111111</div>;});const ImgShow = memo(({setIsView , isView}) => {    useEffect(() => {    console.log("渲染3");  });  return (    <div>      <div        style={{          width: "100px",          height: "100px",          backgroundColor: "red"        }}        onClick={() => {          setIsView(!isView);          console.log(5555555, isView);        }}      ></div>      <Test />    </div>  );});