当前位置: 首页 > news >正文

React 学习——React.memo(简单、引用类型的prop)

  1.  传递一个简单类型的prop,prop变化时组件重新渲染

  2. 传递一个引用类型的prop,比较的是新值和旧值的引用是否相等;当父组件的函数重新执行时,实际上形成的是新的数组引用;

  3. 保持引用稳定->useMemo 组件渲染的过程中缓存一个值

    import {  memo, useMemo, useState } from 'react';const MemoSon = memo(function Son({count,list}){console.log('子组件渲染',count);return <div>子组件</div>
    })const App = () => {const [count, setCount] = useState(0);//简单类型// const list = [1,2,3,4,5];//引用类型const list = useMemo(()=>{  //缓存,子组件就不会跟着重新渲染了return [1,2,3,4,5];},[])return (<div className="home">{/* count={count} */}<MemoSon list={list} /><button onClick={() => setCount(count + 1)}>+{count}</button></div>)
    }export default App


http://www.mrgr.cn/news/4137.html

相关文章:

  • Maven的简单使用
  • maven进阶(超详细)
  • [论文笔记]ZeRO: Memory Optimizations Toward Training Trillion Parameter Models
  • etcd参数解释
  • 《艺术与设计》是什么级别的期刊?是正规期刊吗?能评职称吗?
  • 18款各具特色的项目管理系统软件,项目经理用过都说好!
  • Unity XR Interaction Toolkit 通过两个手柄控制物体放大缩小
  • 开源低代码开发工具Lowcoder
  • VTK—vtkCutter截取平面数据
  • 嵌入式AI快速入门课程-K510篇 (第二篇 Ubuntu的基础操作)
  • uniapp 获取定位权限及问题解决
  • wordrpess心得
  • 【图文并茂】ant design pro 如何给后端发送 json web token - 请求拦截器的使用
  • 设计模式 -- 七大原则(二)-- 接口隔离原则
  • LeetCode216 组合总和 III
  • 十三、OpenCVSharp的目标检测
  • Android常见的界面布局
  • 【JVM】JVM内存模型与操作系统内存模型(一)
  • UDP网络聊天室
  • appium下载及安装