#ctx.getValue()

Pada skenario field yang dapat diedit seperti JSField, JSItem, mendapatkan nilai terbaru dari field saat ini. Bersama dengan ctx.setValue(v) dapat mengimplementasikan binding dua arah dengan form.

#Skenario Penggunaan

Perhatian: ctx.getValue() hanya tersedia pada konteks RunJS dengan binding form; pada skenario tanpa field binding seperti event flow, aturan linkage, method ini tidak ada.

#Definisi Tipe

getValue<T = any>(): T | undefined;

• Return Value: nilai field saat ini, tipe ditentukan oleh tipe form item field; saat field belum terdaftar atau belum diisi mungkin undefined.

#Urutan Pengambilan Nilai

ctx.getValue() mengambil nilai dengan urutan berikut:

1. Status Form: lebih utamakan membaca dari status saat ini Ant Design Form
2. Nilai Fallback: jika field tidak ada di form, kembali ke nilai awal field atau props

Saat form belum selesai dirender atau field belum terdaftar, mungkin mengembalikan undefined.

#Contoh

#Render Berdasarkan Nilai Saat Ini

const current = ctx.getValue();
if (current == null || current === '') {
  ctx.render(<span>Silakan masukkan konten terlebih dahulu</span>);
} else {
  ctx.render(<span>Nilai saat ini: {current}</span>);
}

#Bersama dengan setValue Mengimplementasikan Binding Dua Arah

const { Input } = ctx.libs.antd;

// Membaca nilai saat ini sebagai default value
const defaultValue = ctx.getValue() ?? '';

ctx.render(
  <Input
    defaultValue={defaultValue}
    onChange={(e) => ctx.setValue(e.target.value)}
  />
);

#Terkait

• ctx.setValue() - Menyetel nilai field saat ini, bersama dengan getValue mengimplementasikan binding dua arah
• ctx.form - Instance Ant Design Form, dapat membaca/menulis field lain
• js-field:value-change - Event container yang dipicu saat nilai berubah dari luar, untuk update tampilan