Klientiniai komponentai NextJS karkase
Dabar perdarykime mūsų serverinį
komponentą į klientinį. Tam
komponento failo pradžioje parašykime
direktyvą 'use client':
'use client';
export default function Test() {
return <h1>hello, user!</h1>;
}
Dabar mums taps prieinamos būsenos,
kurtos per useState.
Pavyzdžiui, sukurkime būseną
ir atvaizduokime jos turinį išvaizdoje:
'use client';
import { useState } from 'react';
export default function Test() {
let [name, setName] = useState('user');
return <h1>hello, {name}!</h1>;
}
Sukurkite klientinį komponentą su dviem įvesties laukais ir mygtuku. Įvesties laukuose įvedami skaičiai. Paspaudus mygtuką, atvaizduokite paragrafe įvestų skaičių sumą.
Pašalinkite direktyvą 'use client'.
Įsitikinkite, kad šiuo atveju NextJS
parodys klaidą dėl to, kad negalima naudoti būsenų
serveriniuose komponentuose.
