7_Hooks_useMemo.jsx 527 B

12345678910111213141516171819202122
  1. import { useMemo,useState } from "react";
  2. export default function Memo({name}){
  3. let [Num,setNum] = useState(7)
  4. // useMemo类似于Vue中的计算属性,缓存功效,缓存值
  5. // useMemo(()=>{},[依赖项])
  6. // 一定要判断场景 使用useMemo
  7. // let newNum = useMemo(()=>Num+10,[Num])
  8. let newNum = useMemo(()=>{
  9. console.log('useMemo执行了');
  10. return Num+10
  11. },[Num])
  12. return (
  13. <div>
  14. <h3>{newNum}</h3>
  15. <p>{name}</p>
  16. </div>
  17. )
  18. }