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
相关推荐
薛一半14 小时前
React的组件
前端·javascript·react.js
广州华水科技15 小时前
水库的单北斗GNSS变形监测系统是什么?主要有哪些应用?
前端
薛一半15 小时前
React三大属性之props
前端·javascript·react.js
The_Uniform_C@t215 小时前
PWN | 对CTF WIKI的复现+再学习 (第九期)
网络·学习·网络安全
Hello_Embed15 小时前
Modbus 传感器开发:从寄存器规划到点表设计
笔记·stm32·单片机·学习·modbus
今儿敲了吗15 小时前
24| 字符串
数据结构·c++·笔记·学习·算法
Wect15 小时前
LeetCode 105. 从前序与中序遍历序列构造二叉树:题解与思路解析
前端·算法·typescript
烤麻辣烫16 小时前
正则表达式快速掌握
前端·javascript·学习·正则表达式·html
长城202416 小时前
HTML5中可以省略属性值的11个属性总结
前端·html·html5·属性值·省略属性值
木斯佳16 小时前
前端八股文面经大全:小红书前端一面(2026-2-3)·面经深度解析
前端·状态模式