← Next.js12 / 57

Mengoper Data & Children Menembus Boundary

Data yang dioper dari Server Component ke Client Component via props harus bersifat serializable (JSON-friendly: string, number, plain object).

👀 Contoh dulu

// ✅ Oper plain object: <ClientWidget data={{ id: 1 }} />
// ❌ Jangan oper fungsi: <ClientWidget onClick={() => {}} /> dari server

Hasilnya: Data ter-serialize aman dari server ke client bundle.

💡 Fungsi JS tidak bisa di-serialize dari server ke client via props biasa.

📝 Sekarang giliranmu

Kamu ingin melempar data pengguna dari Server Component ke Client Component <Profile />. Dari objek data berikut, hapus properti sayHello karena fungsi JS tidak bisa di-serialize (dikirim sebagai teks) ke browser.

Preview
← SebelumnyaBerikutnya →