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: src/content/reference/react/createRef.md
+22-22Lines changed: 22 additions & 22 deletions
Original file line number
Diff line number
Diff line change
@@ -4,13 +4,13 @@ title: createRef
4
4
5
5
<Pitfall>
6
6
7
-
`createRef`is mostly used for [class components.](/reference/react/Component)Function components typically rely on[`useRef`](/reference/react/useRef) instead.
7
+
`createRef`kebanyakan digunakan untuk [komponen kelas.](/reference/react/Component)Sedangkan komponen fungsi biasanya mengandalkan[`useRef`](/reference/react/useRef).
8
8
9
9
</Pitfall>
10
10
11
11
<Intro>
12
12
13
-
`createRef`creates a [ref](/learn/referencing-values-with-refs)object which can contain arbitrary value.
13
+
`createRef`membuat sebuah objek [*ref*](/learn/referencing-values-with-refs)yang menyimpan nilai apapun.
14
14
15
15
```js
16
16
classMyInputextendsComponent {
@@ -25,11 +25,11 @@ class MyInput extends Component {
25
25
26
26
---
27
27
28
-
## Reference {/*reference*/}
28
+
## Referensi {/*reference*/}
29
29
30
30
### `createRef()` {/*createref*/}
31
31
32
-
Call`createRef`to declare a [ref](/learn/referencing-values-with-refs)inside a [class component.](/reference/react/Component)
32
+
Panggil`createRef`untuk mendeklarasikan sebuah [*ref*](/learn/referencing-values-with-refs)di dalam sebuah [komponen kelas.](/reference/react/Component)
33
33
34
34
```js
35
35
import { createRef, Component } from'react';
@@ -40,31 +40,31 @@ class MyComponent extends Component {
40
40
// ...
41
41
```
42
42
43
-
[See more examples below.](#usage)
43
+
[Lihat contoh lebih banyak di bawah.](#usage)
44
44
45
-
#### Parameters {/*parameters*/}
45
+
#### Parameter {/*parameters*/}
46
46
47
-
`createRef`takes no parameters.
47
+
`createRef`tidak memerlukan parameter.
48
48
49
-
#### Returns {/*returns*/}
49
+
#### Kembalian {/*returns*/}
50
50
51
-
`createRef`returns an object with a single property:
51
+
`createRef`mengembalikan sebuah objek dengan properti tunggal:
52
52
53
-
* `current`: Initially, it's set to the `null`. You can later set it to something else. If you pass the ref object to React as a `ref`attribute to a JSX node, React will set its `current` property.
53
+
* `current`: Awalnya, bernilai `null`. Anda dapat menggantinya dengan nilai lain kemudian. Jika Anda mengoper objek *ref* ke React sebagai sebuah atribut `ref`di dalam simpul JSX, React akan menetapkannya sebagai properti `current`.
54
54
55
55
#### Caveats {/*caveats*/}
56
56
57
-
* `createRef`always returns a *different* object. It's equivalent to writing`{ current:null }`yourself.
58
-
* In a function component, you probably want [`useRef`](/reference/react/useRef) instead which always returns the same object.
### Declaring a ref in a class component {/*declaring-a-ref-in-a-class-component*/}
65
+
### Mendeklarasikan sebuah ref di dalam komponen kelas {/*declaring-a-ref-in-a-class-component*/}
66
66
67
-
To declare a ref inside a [class component,](/reference/react/Component) call`createRef`and assign its result to a class field:
67
+
Untuk mendeklarasikan *ref* di dalam sebuah [komponen kelas,](/reference/react/Component) panggil`createRef`dan tetapkan hasilnya ke anggota (*field*) kelas:
68
68
69
69
```js {4}
70
70
import { Component, createRef } from'react';
@@ -76,7 +76,7 @@ class Form extends Component {
76
76
}
77
77
```
78
78
79
-
If you now pass `ref={this.inputRef}`to an`<input>`in your JSX, React will populate `this.inputRef.current` with the input DOM node. For example, here is how you make a button that focuses the input:
79
+
Jika Anda mengoper `ref={this.inputRef}`ke sebuah`<input>`di dalam JSX Anda, React akan menempatkan input simpul DOM ke `this.inputRef.current`. Ini Contohnya bagaimana Anda membuat tombol yang memfokuskan ke input:
80
80
81
81
<Sandpack>
82
82
@@ -107,17 +107,17 @@ export default class Form extends Component {
107
107
108
108
<Pitfall>
109
109
110
-
`createRef`is mostly used for [class components.](/reference/react/Component) Function components typically rely on [`useRef`](/reference/react/useRef) instead.
110
+
`createRef`kebanyakan digunakan untuk [komponen kelas.](/reference/react/Component) sedangkan komponen fungsional biasanya mengandalkan [`useRef`](/reference/react/useRef).
111
111
112
112
</Pitfall>
113
113
114
114
---
115
115
116
-
## Alternatives {/*alternatives*/}
116
+
## Alternatif {/*alternatives*/}
117
117
118
-
### Migrating from a class with `createRef`to a function with`useRef` {/*migrating-from-a-class-with-createref-to-a-function-with-useref*/}
118
+
### Migrasi dari kelas dengan `createRef`ke fungsi dengan`useRef` {/*migrating-from-a-class-with-createref-to-a-function-with-useref*/}
119
119
120
-
We recommend using function components instead of [class components](/reference/react/Component) in new code. If you have some existing class components using `createRef`, here is how you can convert them. This is the original code:
120
+
Kami merekomendasikan untuk menggunakan komponen fungsi dari pada [komponen kelas](/reference/react/Component) pada kode baru. Jika Anda memiliki komponen kelas yang menggunakan `createRef`, ini cara bagaimana mengubahnya. Ini merupakan kode awal:
121
121
122
122
<Sandpack>
123
123
@@ -146,7 +146,7 @@ export default class Form extends Component {
146
146
147
147
</Sandpack>
148
148
149
-
When you [convert this component from a class to a function,](/reference/react/Component#alternatives) replace calls to `createRef`with calls to [`useRef`:](/reference/react/useRef)
149
+
Saat Anda [mengubah komponen ini dari kelas ke fungsi,](/reference/react/Component#alternatives) ganti pemanggilan `createRef`dengan [`useRef`:](/reference/react/useRef)
0 commit comments