Állapotokon alapuló számláló Reactban
Készítsünk egy számlálót, amely a gombra kattintva növekszik:
function App() {
const [count, setCount] = useState(0);
function clickHandler() {
setCount(count + 1);
}
return <div>
<span>{count}</span>
<button onClick={clickHandler}>+</button>
</div>;
}
Megszabadulhatunk a kezelőfüggvénytől anonim nyílfüggvényre cserélve:
function App() {
const [count, setCount] = useState(0);
return <div>
<span>{count}</span>
<button onClick={() => setCount(count + 1)}>+</button>
</div>;
}
Tároljunk egy számot az állapotban. Jelenítsük meg ezt a számot egy bekezdésben. Készítsünk két gombot. Az első gomb növelje a számot eggyel, a második pedig csökkentse.