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
相关推荐
Dontla27 分钟前
React zustand todos案例(带本地存储localStorage、persist)todoStore.ts
前端·react.js·前端框架
阿珊和她的猫28 分钟前
WebRTC 技术深度解析:实时通信的未来引擎
前端·webpack·node.js·webrtc
silence_xiang30 分钟前
【React】首页悬浮球实现,点击出现悬浮框
前端·javascript·react.js
淮北49437 分钟前
linux系统学习(10.shell基础)
linux·运维·服务器·学习
申阳1 小时前
Day 11:集成百度统计以监控站点流量
前端·后端·程序员
zhangfeng11331 小时前
学习文本大模型的学习路径,各种大模型对比和分类以及各个大模型对硬件的要求,开源大模型有哪些
学习·分类·开源
Cache技术分享1 小时前
239. Java 集合 - 通过 Set、SortedSet 和 NavigableSet 扩展 Collection 接口
前端·后端
超级罗伯特1 小时前
大屏自适应,响应式布局,亲测有效
前端·javascript·html·大屏·驾驶舱
青衫码上行1 小时前
【Java Web学习 | 第九篇】JavaScript(3) 数组+函数
java·开发语言·前端·javascript·学习
前端老宋Running1 小时前
React组件命名为什么用小写开头会无法运行?
前端·react.js·面试