(一)需要

最近在学习React,学到了React Hook 做了 useMemo Demo。

(二)介绍

应用useMemo是为了进而保留变量初始的值,并且依赖其余变量的扭转后才更新的操作。

/* * @Author: ArdenZhao * @Date: 2022-04-20 11:18:24 * @LastEditTime: 2022-04-20 11:36:50 * @FilePath: /react-ts/src/components/react/12-Hook-useMemo.js * @Description: file information */import { useState, useMemo } from 'react';import { Button } from 'antd';import "antd/dist/antd.css";function HookUseMemo(props) {  let [count, setCount] = useState(10);  let [num, setNum] = useState(0);  function changeCount() {    setCount(count + 1);  }  function changeNum() {    setNum(num + 1);  }  const memorized = useMemo(() => {    return count;  }, [num]);  console.log('[ memorized ] >', memorized) //12-Hook-useMemo.js:31 [ memorized ] > 10  // memorized中的count 的值没有随着count变动而,更新,作用是保留了初始count的值  // 当点击按钮时,num的值会发生变化,memorized的值也会发生变化,然而count的值不会发生变化  return (    <div>      <h1>Learn, {props.name}</h1>      <p>Count:{count}</p>      <Button onClick={changeCount}>Count加一</Button>      <p>Num:{num}</p>      <Button onClick={changeNum}>Num加一</Button>    </div>  );}export default HookUseMemo

写在最初的话

学习路上,经常会懈怠。

《有想学技术须要监督的同学嘛~》
https://mp.weixin.qq.com/s/Fy...

如果有须要的搭档,能够加我微信:learningisconnecting
或者能够关注我的公众号:国星聊成长(我会分享成长的办法)