Μετρητής σε Καταστάσεις στο React
Ας φτιάξουμε έναν μετρητή κλικ σε ένα κουμπί:
function App() {
const [count, setCount] = useState(0);
function clickHandler() {
setCount(count + 1);
}
return <div>
<span>{count}</span>
<button onClick={clickHandler}>+</button>
</div>;
}
Μπορούμε να απαλλαγούμε από τη συνάρτηση-χειριστή, αντικαθιστώντας την με μια ανώνυμη συναρτησιακή έκφραση βέλους:
function App() {
const [count, setCount] = useState(0);
return <div>
<span>{count}</span>
<button onClick={() => setCount(count + 1)}>+</button>
</div>;
}
Ας υποθέσουμε ότι ένας αριθμός αποθηκεύεται στην κατάσταση. Εμφανίστε αυτόν τον αριθμό σε μια παράγραφο. Φτιάξτε δύο κουμπιά. Ας κάνει το πρώτο κουμπί να αυξάνει τον αριθμό κατά ένα, και το δεύτερο - να τον μειώνει.