react hooks useMemo和useCallback

export default () => {
    const [count, setCount] = useState(0);
    const isEvenNumber = useMemo(()=>{
        return count % 2 === 0
    }, [count])

    const onClick = useCallback(()=>{
        setCount(count+1)
    },[count])

    return (<div>
        <div>{count} is {isEvenNumber? ‘even‘:‘odd‘} number</div>
        <button onClick={onClick}>click me</button>
    </div>)
}

• 区别：
• useMemo 主要用来缓存计算结果,节省的是计算开销
• useCallback 主要缓存函数，节省函数的不必要的重新创建(或刷新)开销

react hooks useMemo和useCallback

原文：https://www.cnblogs.com/chengyunshen/p/14810171.html