react中useCallback使用



import React ,{useState,useCallback,memo} from 'react'

const Child = memo((props) =>{
    console.log('child run ...');

    return(
        <>
            <h1>hello</h1>
            <button onclick="{props.onAdd}">add</button>
        
    )
})

export default function UseCallback() {
    console.log('parent run ...');
    let  [count, setCount] = useState(0)

  const handAdd = useCallback(
     () =>{
        console.log('父組件里的handAdd執行了。。。。');
      },
      [],
  ) 

//   const handAdd = () =>{
//     console.log('父組件里的handAdd執行了。。。。');
//   }
 
    return (
        <div>
            <h2>{count}</h2>
            <child onadd="{handAdd}">
            <button onclick="{()" ==""> setCount(100)}>changeCount</button>
        </child></div>
    )
}


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM