Open spalt08 opened 10 months ago
As a developer I expect getData function to be immutable, so I can use it as a dependency inside useEffect. However it seems like getData function is re-created on each render.
getData
useEffect
Simple example
function Component({ changingPropName }) { const { getData } = useVisitorData() useEffect(() => { console.log('effect triggered', getData) }, [getData]) return <div>{changingPropName}</div> } function Emulate() { const [counter, setCounter] = useState(1); useEffect(() => { setInterval(() => setCounter((state) => state + 1), 1000) }, [setCounter]) return <Component changingPropName={counter} /> } ReactDOM.render(<Emulate />, document.body)
Workaround I am using:
// eslint-disable-next-line react-hooks/exhaustive-deps const getDataMemo = useMemo(() => getData, [])
As a developer I expect
getData
function to be immutable, so I can use it as a dependency insideuseEffect
. However it seems likegetData
function is re-created on each render.Simple example