Componente client în framework-ul NextJS
Haideți acum să refacem componenta noastră
server în una client. Pentru aceasta
scriem la începutul fișierului componentei
directiva 'use client':
'use client';
export default function Test() {
return <h1>hello, user!</h1>;
}
Acum vor deveni accesibile stările,
create prin useState.
Haideți de exemplu să creăm o stare
și să afișăm conținutul ei în markup:
'use client';
import { useState } from 'react';
export default function Test() {
let [name, setName] = useState('user');
return <h1>hello, {name}!</h1>;
}
Realizați o componentă client cu două input-uri și un buton. Lăsați în input-uri să fie introduse numere. La apăsarea butonului afișați într-un paragraf suma numerelor introduse.
Eliminați directiva 'use client'.
Asigurați-vă că în acest caz NextJS
va afișa o eroare datorită faptului că
nu se pot utiliza stări
în interiorul componentelor server.