当前位置: 首页 > Web前端 > JavaScript

Day44-100ReactHookuseMemo的基本用法

时间:2023-03-27 01:32:09 JavaScript

(1)需求最近在学习React,在学习了ReactHook之后,做了一个useMemoDemo。(2)介绍useMemo的使用,保留变量初始值,其他变量变化后更新操作。/**@Author:ArdenZhao*@Date:2022-04-2011:18:24*@LastEditTime:2022-04-2011:36:50*@FilePath:/react-ts/src/components/react/12-Hook-useMemo.js*@Description:文件信息*/import{useState,useMemo}from'react';import{Button}from'antd';import"antd/dist/antd.css";functionHookUseMemo(props){让[count,setCount]=useState(10);让[num,setNum]=useState(0);函数changeCount(){setCount(count+1);}functionchangeNum(){setNum(num+1);}constmemorized=useMemo(()=>{returncount;},[num]);console.log('[memorized]>',memorized)//12-Hook-useMemo.js:31[memorized]>10//memorized中count的值不会随着count的变化而更新,效果是保留初始count的值//当点击按钮时,num的值会改变,memorized的值也会改变,但是count的值不会改变return(

Learn,{props.name}

Count:{count}

Countplusone

Num:{num}

Numplusone
);}exportdefaultHookUseMemo写在学习途中的最后一句话,经常懈怠《有想学技术需要监督的同学嘛~》https://mp.weixin.qq.com/s/Fy...需要小伙伴可以加我微信:learningisconnecting或者关注公众号:国兴聊成长(我会分享生长方式)

最新推荐
猜你喜欢