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
Copy file name to clipboardExpand all lines: content/docs/state-and-lifecycle.md
+12-12Lines changed: 12 additions & 12 deletions
Original file line number
Diff line number
Diff line change
@@ -76,11 +76,11 @@ _State_ mirip dengan _props_, tetapi bersifat pribadi dan sepenuhnya dikendalika
76
76
77
77
Anda bisa mengubah sebuah _function component_ seperti `Clock` ke sebuah kelas dalam lima langkah:
78
78
79
-
1. Buat sebuah [kelas ES6](https://developer.mozilla.org/id/docs/Web/JavaScript/Reference/Classes), dengan nama yang sama, yang meng-_extends_`React.Component`.
79
+
1. Buat sebuah [kelas ES6](https://developer.mozilla.org/id/docs/Web/JavaScript/Reference/Classes), dengan nama yang sama, yang diturunkan dari`React.Component`.
80
80
81
-
2. Tambah sebuah _method_ kosong disitu yang bernama `render()`.
81
+
2. Tambah sebuah _method_ kosong yang bernama `render()`.
82
82
83
-
3.Pindah isi fungsi ke dalam _method_`render()`.
83
+
3.Pindahkan isi fungsi ke dalam _method_`render()`.
84
84
85
85
4. Ganti `props` dengan `this.props` di dalam `render()`.
86
86
@@ -246,9 +246,9 @@ _Method_ `componentDidMount()` berjalan setelah hasil komponen sudah ter-_render
246
246
247
247
Perhatikan bagaimana kami menyimpan _ID_ pengatur _timer_ langsung di `this`.
248
248
249
-
Ketika `this.props` diatur oleh React sendiri dan `this.state` punya arti spesial, Anda dapat dengan bebas untuk menambah bidang tambahan di kelas secara manual jika Anda butuh untuk menyimpan sesuatu yang tidak ikut berpartisipasi di alur data (seperti _ID timer_).
249
+
Ketika `this.props` diatur oleh React sendiri dan `this.state` punya arti spesial, Anda dapat dengan bebas untuk menambah _field_ tambahan di kelas secara manual jika Anda butuh untuk menyimpan sesuatu yang tidak ikut berpartisipasi di alur data (seperti _ID timer_).
250
250
251
-
Kita akan membongkar_timer_ di _method lifecycle_`componentWillUnmount()`:
251
+
Kita akan menghapus_timer_ di _method lifecycle_`componentWillUnmount()`:
252
252
253
253
```js{2}
254
254
componentWillUnmount() {
@@ -312,9 +312,9 @@ Mari kita rekap dengan cepat apa yang terjadi dan urutan _method_ yang dipanggil
312
312
313
313
3) Ketika hasil `Clock` dimasukkan ke dalam _DOM_, React memanggil _method lifecycle_`componentDidMount()`. Didalamnya, komponen `Clock` menyuruh _browser_ untuk mengatur sebuah _timer_ untuk memanggil _method_`tick()` milik komponen sekali per detik.
314
314
315
-
4) Setiap detik _browser_ memanggil _method_`tick()`. Didalamnya, komponen `Clock` menjadwal pembaruan _UI_ dengan memanggil `setState()` dengan sebuah obyek berisi waktu sekarang. Berkat panggilan `setState()`, React tau_state_ sudah terubah, dan memanggil _method_`render()`lain untuk belajar apa yang harusnya ada di layar. Kali ini, `this.state.date` di `render()`_method_ akan berbeda, dan jadi hasil _render_ akan mencakup waktu yang diperbarui. React telah memperbarui _DOM_ dengan sesuai.
315
+
4) Setiap detik _browser_ memanggil _method_`tick()`. Didalamnya, komponen `Clock` menjadwal pembaruan _UI_ dengan memanggil `setState()` dengan sebuah obyek berisi waktu sekarang. Berkat panggilan `setState()`, React mengetahui_state_ sudah berubah, dan memanggil _method_`render()`lagi untuk mempelajari apa yang harusnya ada di layar. Kali ini, `this.state.date` di `render()`_method_ akan berbeda, dan jadi hasil _render_ akan mencakup waktu yang diperbarui. React telah memperbarui _DOM_ dengan sesuai.
316
316
317
-
5) Jika komponen `Clock`pernah terhapus dari _DOM_, React memanggil _method lifecycle_`componentWillUnmount()` jadi _timer_ akan berhenti.
317
+
5) Jika komponen `Clock`dihapus dari _DOM_, React memanggil _method lifecycle_`componentWillUnmount()` jadi _timer_ akan berhenti.
318
318
319
319
## Menggunakan _State_ Dengan Benar {#using-state-correctly}
320
320
@@ -329,7 +329,7 @@ Sebagai contoh, ini tidak akan me-_render_ komponen :
329
329
this.state.comment='Halo';
330
330
```
331
331
332
-
Sebagai gantinya, pakai`setState()`:
332
+
Sebagai gantinya, gunakan`setState()`:
333
333
334
334
```js
335
335
// Benar
@@ -340,9 +340,9 @@ Satu-satunya tempat di mana Anda dapat menetapkan `this.state` adalah di konstru
340
340
341
341
### Pembaruan _State_ Mungkin _Asynchronous_ {#state-updates-may-be-asynchronous}
342
342
343
-
React dapat mengelompokkan beberapa panggilan `setState()` menjadi satu pembaruan untuk kinerja.
343
+
React dapat mengelompokkan beberapa panggilan `setState()` menjadi satu untuk kinerja lebih baik.
344
344
345
-
Karena `this.props` dan `this.state` mungkin diperbarui secara _asynchronous_, Anda seharusnya tidak mengandalkan nilai-nilai mereka untuk menghitung _State_ berikutnya.
345
+
Karena `this.props` dan `this.state` mungkin diperbarui secara _asynchronous_, Anda seharusnya tidak mengandalkan nilai-nilai tersebut untuk menghitung _State_ berikutnya.
346
346
347
347
Sebagai contoh, kode ini mungkin gagal untuk memperbarui penghitung:
348
348
@@ -353,7 +353,7 @@ this.setState({
353
353
});
354
354
```
355
355
356
-
Untuk memperbaikinya, pakai bentuk kedua dari `setState()` yang menerima fungsi rather daripada sebuah object. Fungsi itu akan menerima _state_ sebelumnya sebagai argumen pertama, dan _props_ pada waktu itu pembaruanya di terapkan ke argumen kedua:
356
+
Untuk memperbaikinya, pakai bentuk kedua dari `setState()` yang menerima fungsi daripada sebuah objek. Fungsi itu akan menerima _state_ sebelumnya sebagai argumen pertama, dan _props_ pada waktu itu pembaruanya di terapkan ke argumen kedua:
Kita menggunakan [_arrow function_](https://developer.mozilla.org/id/docs/Web/JavaScript/Reference/Functions/Arrow_functions) diatas, tapi itu juga berkerja dengan fungsi biasa:
365
+
Kita menggunakan [_arrow function_](https://developer.mozilla.org/id/docs/Web/JavaScript/Reference/Functions/Arrow_functions) diatas, tetapi juga bisa menggunakan fungsi biasa:
0 commit comments