React 学习——React.memo

1、默认情况下:子跟着父一起渲染

2、memo 缓存,只有props发生变化的时候才会重新渲染

javascript 复制代码
import {  memo, useState } from 'react';
// 默认情况下:子跟着父一起渲染
//memo 缓存,只有props发生变化的时候才会重新渲染
const MemoSon = memo(function Son(){
  console.log('子组件渲染');
  return <div>子组件</div>
})
// function Son(){
//   console.log('子组件渲染');
//   return <div>子组件</div>
// }

const App = () => {
  const [count, setCount] = useState(0);
  return (
    <div className="home">
     {/* <Son /> */}
     <MemoSon />
     <button onClick={() => setCount(count + 1)}>+{count}</button>
    </div>
  )
}

export default App
相关推荐
阳火锅11 分钟前
💡 告别类名地狱!Tailwind CSS 语义化转换神器来了
前端·css·vue.js
ricardo197314 分钟前
Core Web Vitals 全解:LCP / INP / CLS 逐个击破
前端
VillenK16 分钟前
版本依赖问题:vite-plugin-dts@3.1.0 与 jiti 的兼容性
前端·typescript·vite
Apifox36 分钟前
如何在 Apifox 中快速构建和调试 AI Agent
前端·agent·ai编程
一晌贪欢i41 分钟前
WebContainer 重点介绍
前端·webcontainer
山河木马43 分钟前
Emscripten 从 C/C++ 调用 JavaScript
前端·javascript·c++
霑潇雨1 小时前
Spark学习基础转换算子案例(单词计数(WordCount))
java·大数据·分布式·学习·spark·maven
鹏程十八少1 小时前
12. Android 协程通关秘籍:31 道资深工程师面试题精讲
前端·后端·面试
Dlrb12111 小时前
C语言-字符串指针与函数指针
java·c语言·前端
PBitW1 小时前
组件封装注意事项
前端·vue.js