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>
    )
}

react中useCallback使用

上一篇:react中useCallback使用案例


下一篇:10.react的hook之useCallback