useCallback 作用,主要用于缓存函数的。
js
import { FC, useCallback, useMemo, useState } from 'react';
const UserCallback: FC = () => {
const [text, setText] = useState('hello')
const fn1 = () => {
console.log('fn1')
}
const fn2 = useCallback(() => {
console.log('fn2 text', text)
}, [text])
return <>
<div>
<button onClick={fn1}> fn1</button>
<div>
<button onClick={fn2}> fn2</button>
</div>
{text}
<div>
<input type="text" value={text} onChange={e => setText(e.target.value) } />
</div>
</div>
</>
}
export default UserCallback;