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
相关推荐
又写一个小bug14 分钟前
如何让你的Vue项目支持局域网访问 - 完整指南
前端
walking95718 分钟前
前端开发中常用的JavaScript方法
前端·面试
大舔牛21 分钟前
图片优化全景策略
前端·面试
卸任32 分钟前
阿里云域名迁移到Cloudflare DNS管理
前端·dns
speop39 分钟前
【datawhale组队学习】RAG技术 -TASK05 向量数据库实践(第三章3、4节)
数据库·学习
谢小飞42 分钟前
Echarts高级柱状图开发:渐变与3D效果实现
前端·echarts
FogLetter1 小时前
Vite vs Webpack:前端构建工具的双雄对决
前端·面试·vite
tianchang1 小时前
JS 排序神器 sort 的正确打开方式
前端·javascript·算法
阿阳微客1 小时前
CSGO搬砖项目详解:从装备选择到市场策略
笔记·学习·游戏