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
相关推荐
张清悠1 分钟前
CSS引入外部第三方字体
前端·javascript·css
追逐梦想之路_随笔3 分钟前
手撕Promise,实现then|catch|finally|all|allSettled|race|any|try|resolve|reject等方法
前端·javascript
张较瘦_4 分钟前
前端 | 吃透CSS视觉特效:圆角、渐变、动画与变换核心解析
前端·css
Tzarevich4 分钟前
Tailwind CSS:原子化 CSS 的现代开发实践
前端·javascript·css
借个火er5 分钟前
React 19 源码揭秘(二):useState 的实现原理
前端
YaeZed36 分钟前
Vue3-插槽slot
前端·vue.js
杨进军37 分钟前
如何实现划词效果
前端·javascript
前端老爷更车38 分钟前
esp32 小智AI 项目
前端
destinying38 分钟前
五年前端,我凌晨三点的电脑屏幕前终于想通了这件事
前端·javascript·vue.js
想学后端的前端工程师39 分钟前
【React Hooks深度实战指南:从原理到最佳实践】
前端·react.js·前端框架