Betrachte folgenden Codeausschnitt:
import React, { useEffect, useState } from 'react';
function Example() {
const [count, setCount] = useState(0);
useEffect(() => {
console.log('Count updated:', count);
}, [count]);
return <button onClick={() => setCount(count + 1)}>Click me</button>;
}
Welches Verhalten ist korrekt?

Question

Betrachte folgenden Codeausschnitt:

import React, { useEffect, useState } from 'react';

function Example() {

const [count, setCount] = useState(0);

useEffect(() => {

console.log('Count updated:', count);

}, [count]);

return <button onClick={() => setCount(count + 1)}>Click me</button>;

}

Welches Verhalten ist korrekt?

Answer

Der useEffect-Hook wird nur beim ersten Rendern ausgeführt, nicht bei späteren Klicks.

Answer

Bei jedem Klick auf den Button wird der count erhöht und der useEffect-Hook gibt den neuen Wert in der Konsole aus.

Answer

Der Button löst den useEffect-Hook aus, bevor der State aktualisiert wird.

Answer

Der useEffect-Hook wird gar nicht ausgeführt, weil die Abhängigkeiten fehlen.

Crowdly