You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Untuk menampilkan sebuah masukan, render komponen [bawaan peramban `<input>`](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input).
23
+
Untuk menampilkan sebuah masukan, *render* komponen [bawaan peramban `<input>`](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input).
24
24
25
25
```js
26
26
<input name="myInput"/>
@@ -101,7 +101,7 @@ Props `<input>` ini relevan untuk masukan tidak terkontrol dan masukan terkontro
101
101
102
102
### Menampilkan masukan dari berbagai jenis {/*displaying-inputs-of-different-types*/}
103
103
104
-
Untuk menampilkan masukan, render sebuah komponen `<input>`. Secara default, itu akan menjadi masukan teks. Anda dapat mengopen `type="checkbox"` untuk sebuah checkbox, `type="radio"` untuk sebuah tombol radio, [atau salah satu dari jenis masukan lainnya.](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#input_types)
104
+
Untuk menampilkan masukan, *render* sebuah komponen `<input>`. Secara default, itu akan menjadi masukan teks. Anda dapat mengopen `type="checkbox"` untuk sebuah checkbox, `type="radio"` untuk sebuah tombol radio, [atau salah satu dari jenis masukan lainnya.](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#input_types)
105
105
106
106
<Sandpack>
107
107
@@ -305,7 +305,7 @@ Secara default, *apapun* `<button>` di dalam sebuah `<form>` akan melakukan subm
305
305
306
306
Sebuah masukan seperti `<input />`*tidaklah terkontrol.* Bahkan jika Anda [memberikan sebuah nilai awal](#providing-an-initial-value-for-an-input) seperti `<input defaultValue="Teks awal" />`, JSX Anda hanya menentukan nilai awal. Tidak mengontrol apa seharusnya nilai sekarang.
307
307
308
-
**Untuk render sebuah masukan _terkontrol_, oper prop `value` ke dalamnya (atau `checked` untuk checkbox and radio).** React akan memaksa masukan untuk selalu memiliki `value` yang Anda berikan. Biasanya, Anda akan melakukan ini dengan mendeklarasikan sebuah [variable *state*:](/reference/react/useState)
308
+
**Untuk *render* sebuah masukan _terkontrol_, oper prop `value` ke dalamnya (atau `checked` untuk checkbox and radio).** React akan memaksa masukan untuk selalu memiliki `value` yang Anda berikan. Biasanya, Anda akan melakukan ini dengan mendeklarasikan sebuah [variable *state*:](/reference/react/useState)
309
309
310
310
```js {2,6,7}
311
311
functionForm() {
@@ -320,7 +320,7 @@ function Form() {
320
320
}
321
321
```
322
322
323
-
Bagaimanapun sebuah masukan terkontrol masuk akal jika Anda membutuhkan *state*--contohnya, untuk rendering ulang UI Anda pada setiap pengeditan:
323
+
Bagaimanapun sebuah masukan terkontrol masuk akal jika Anda membutuhkan *state*--contohnya, untuk *render*-ing ulang UI Anda pada setiap pengeditan:
324
324
325
325
```js {2,9}
326
326
functionForm() {
@@ -414,9 +414,9 @@ p { font-weight: bold; }
414
414
415
415
---
416
416
417
-
### Mengoptimalkan rendering ulang pada setiap penekanan tombol {/*optimizing-re-rendering-on-every-keystroke*/}
417
+
### Mengoptimalkan *render*-ing ulang pada setiap penekanan tombol {/*optimizing-re-rendering-on-every-keystroke*/}
418
418
419
-
Ketika Anda menggunakan masukan terkontrol, Anda mengatur *state* pada setiap penekanan tombol. Jika komponen yang berisi *state* Anda me-*render* ulang pohon besar, ini bisa menjadi lambat. Ada beberapa cara untuk mengoptimalkan kinerja rendering ulang.
419
+
Ketika Anda menggunakan masukan terkontrol, Anda mengatur *state* pada setiap penekanan tombol. Jika komponen yang berisi *state* Anda me-*render* ulang pohon besar, ini bisa menjadi lambat. Ada beberapa cara untuk mengoptimalkan kinerja *render*-ing ulang.
420
420
421
421
Contohnya, misalkan Anda mulai dengan form yang me-*render* ulang semua konten halaman pada setiap penekanan tombol:
422
422
@@ -456,9 +456,9 @@ function SignupForm() {
456
456
}
457
457
```
458
458
459
-
Ini secara signifikan meningkatkan kinerja karena sekarang hanya `SignupForm` yang dirender ulang pada setiap penekanan tombol.
459
+
Ini secara signifikan meningkatkan kinerja karena sekarang hanya `SignupForm` yang di-*render* ulang pada setiap penekanan tombol.
460
460
461
-
Jika tidak ada cara untuk menghindari perenderan ulang (contohnya, jika `PageContent` bergantung pada nilai masukan pencarian), [`useDeferredValue`](/reference/react/useDeferredValue#deferring-re-rendering-for-a-part-of-the-ui) memungkinkan Anda menjaga masukan yang dikontrol tetap responsif bahkan di tengah render ulang yang besar.
461
+
Jika tidak ada cara untuk menghindari pe-*render*-an ulang (contohnya, jika `PageContent` bergantung pada nilai masukan pencarian), [`useDeferredValue`](/reference/react/useDeferredValue#deferring-re-rendering-for-a-part-of-the-ui) memungkinkan Anda menjaga masukan yang dikontrol tetap responsif bahkan di tengah *render* ulang yang besar.
462
462
463
463
---
464
464
@@ -579,7 +579,7 @@ function handleChange(e) {
579
579
}
580
580
```
581
581
582
-
Jika ini tidak menyelesaikan masalah, mungkin saja masukan dihapus dan ditambahkan kembali dari DOM pada setiap penekanan tombol. Ini dapat terjadi jika Anda secara tidak sengaja [menyetel ulang *state*](/learn/preserving-and-resetting-state) pada setiap render ulang, contohnya jika masukan atau salah satu parentnya selalu menerima atribut `key` yang berbeda, atau jika Anda menyusun definisi fungsi komponen (yang tidak didukung dan menyebabkan komponen "dalam" selalu dianggap pohon yang berbeda).
582
+
Jika ini tidak menyelesaikan masalah, mungkin saja masukan dihapus dan ditambahkan kembali dari DOM pada setiap penekanan tombol. Ini dapat terjadi jika Anda secara tidak sengaja [menyetel ulang *state*](/learn/preserving-and-resetting-state) pada setiap *render* ulang, contohnya jika masukan atau salah satu parentnya selalu menerima atribut `key` yang berbeda, atau jika Anda menyusun definisi fungsi komponen (yang tidak didukung dan menyebabkan komponen "dalam" selalu dianggap pohon yang berbeda).
0 commit comments