Klientské komponenty ve frameworku NextJS
Nyní přepracujme naši serverovou
komponentu na klientskou. K tomu
napišme na začátek souboru komponenty
direktivu 'use client':
'use client';
export default function Test() {
return <h1>hello, user!</h1>;
}
Nyní nám budou dostupné stavy,
vytvářené pomocí useState.
Vytvořme například stav
a vypišme jeho obsah ve verstonání:
'use client';
import { useState } from 'react';
export default function Test() {
let [name, setName] = useState('user');
return <h1>hello, {name}!</h1>;
}
Vytvořte klientskou komponentu se dvěma vstupy a tlačítkem. Nechť se do vstupů zadávají čísla. Po stisknutí tlačítka vypište do odstavce součet zadaných čísel.
Odstraňte direktivu 'use client'.
Přesvědčte se, že v tomto případě NextJS
vypíše chybu z důvodu, že nelze používat stavy
uvnitř serverových komponent.
