NextJS Framework'inde İstemci Bileşenleri
Şimdi sunucu bileşenimizi istemci
bileşenine dönüştürelim. Bunun için
bileşen dosyamızın en başına
'use client' direktifini yazalım:
'use client';
export default function Test() {
return <h1>hello, user!</h1>;
}
Artık useState ile oluşturulan
state'lere erişebileceğiz.
Örnek olarak bir state oluşturalım
ve içeriğini görünümde gösterelim:
'use client';
import { useState } from 'react';
export default function Test() {
let [name, setName] = useState('user');
return <h1>hello, {name}!</h1>;
}
İki giriş alanı ve bir düğme ile bir istemci bileşeni yapın. Giriş alanlarına sayılar girilsin. Düğmeye tıklandığında, girilen sayıların toplamını bir paragrafta gösterin.
'use client' direktifini kaldırın.
Bu durumda NextJS'in, sunucu bileşenleri
içinde state'ler kullanılamayacağı
ile ilgili bir hata vereceğinden emin olun.
