Tengo un código como el ejemplo a continuación donde llamo a un setter de estado dentro de la devolución de llamada para otro setter de estado. Todo esto debe suceder dentro de un gancho useCallback para evitar que se llame al gancho useEffect en cada renderizado.

Mi pregunta es, ¿cuántos renderizados activa el gancho useCallback? ¿SetBar aquí desencadenaría otro renderizado? Y si es así, ¿hay una forma más eficiente de escribir esto para activar menos renderizaciones (sin eliminar el gancho useEffect)?

Tenga en cuenta que el código a continuación es solo un ejemplo simplificado del código en mi aplicación.

 const [foo, setFoo] = useState(0) const [bar, setBar] = useState(0) const baz = useCallback(() => { setFoo((prevState) => { const newState = prevState += 1 // does this trigger another render? setBar(newState) return newState }) }) useEffect(() => baz, [baz])