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
相关推荐
一只大侠的侠17 分钟前
React Native实战:高性能Popover弹出框组件
javascript·react native·react.js
输出输入17 分钟前
Java Swing和JavaFX用哪个好
java·前端
星火开发设计19 分钟前
C++ 异常处理:try-catch-throw 的基本用法
java·开发语言·jvm·c++·学习·知识·对象
铁甲前沿19 分钟前
一个月玩转MQTT(篇五:开发自己的MQTT WEB页面)
前端·mqtt·asp.net·mqtt web开发
知识分享小能手23 分钟前
SQL Server 2019入门学习教程,从入门到精通,SQL Server 2019 事务和锁 — 语法知识点及使用方法详解(13)
数据库·学习·sqlserver
一只大侠的侠33 分钟前
React Native for OpenHarmony:Calendar 日程标记与事件管理实现方案
javascript·react native·react.js
~央千澈~39 分钟前
抖音弹幕游戏开发之第7集:识别不同类型的消息·优雅草云桧·卓伊凡
java·服务器·前端
拾荒李1 小时前
在 Vue 项目里“无痛”使用 React 组件:以 Veaury + Vite 为例
前端·vue.js·react.js
dangfulin1 小时前
简单的视差滚动效果
前端·css·视差滚动
Forget_85501 小时前
RHEL——web应用服务器TOMCAT
java·前端·tomcat