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
> `React.PropTypes`has moved into a different package since React v15.5. Please use [the`prop-types` library instead](https://www.npmjs.com/package/prop-types).
11
+
> `React.PropTypes`sudah dipindahkan ke paket yang berbeda sejak React v15.5. Silakan gunakan [pustaka`prop-types`](https://www.npmjs.com/package/prop-types).
12
12
>
13
-
>We provide [a codemod script](/blog/2017/04/07/react-v15.5.0.html#migrating-from-reactproptypes)to automate the conversion.
13
+
>Kami menyediakan [*codemod script*](/blog/2017/04/07/react-v15.5.0.html#migrating-from-reactproptypes)untuk melakukan konversi secara otomatis.
14
14
15
-
As your app grows, you can catch a lot of bugs with typechecking. For some applications, you can use JavaScript extensions like [Flow](https://flow.org/)or[TypeScript](https://www.typescriptlang.org/)to typecheck your whole application. But even if you don't use those, React has some built-in typechecking abilities. To run typechecking on the props for a component, you can assign the special`propTypes` property:
15
+
Dengan berkembangnya aplikasi anda, kit dapat menemukan banyak kesalahan atau *bugs* dengan pengecekan tipe. Untuk beberapa aplikasi, anda dapat menggunakan ekstensi JavaScript seperti [Flow](https://flow.org/)atau[TypeScript](https://www.typescriptlang.org/)untuk melakukan pengecekan tipe di aplikasi secara menyeluruh. Meskipun kamu tidak menggunakannya, React memiliki kemampuan pengecekan tipe. Untuk menjalankan pengecekan terhadap *props* disebuah komponen, kamu dapat menggunakan properti khusus`propTypes`:
16
16
17
17
```javascript
18
18
importPropTypesfrom'prop-types';
@@ -30,18 +30,18 @@ Greeting.propTypes = {
30
30
};
31
31
```
32
32
33
-
`PropTypes`exports a range of validators that can be used to make sure the data you receive is valid. In this example, we're using`PropTypes.string`. When an invalid value is provided for a prop, a warning will be shown in the JavaScript console. For performance reasons, `propTypes`is only checked in development mode.
33
+
`PropTypes`mengirimkan berbagai jenis *validator* yang dapat digunakan untuk memastikan bahwa data yang diterima valid. Contoh diatas, anda menggunakan`PropTypes.string`. Ketika nilai yang dikirimkan untuk sebuah *prop* keliru, sebuah peringatan akan muncul di konsol JavaScript. Untuk alasan performa, `propTypes`hanya melakukan pengecekan di mode pengembangan atau *development*.
34
34
35
35
### PropTypes {#proptypes}
36
36
37
-
Here is an example documenting the different validators provided:
37
+
Berikut contoh mendokumentasikan berbagai validator yang berbeda yang sudah disediakan:
38
38
39
39
```javascript
40
40
importPropTypesfrom'prop-types';
41
41
42
42
MyComponent.propTypes= {
43
-
//You can declare that a prop is a specific JS type. By default, these
44
-
//are all optional.
43
+
//Anda dapat menyatakan bahwa sebuah prop adalah tipe khusus yang berasal dari JS. Secara default,
44
+
//hal ini sifatnya opsional.
45
45
optionalArray:PropTypes.array,
46
46
optionalBool:PropTypes.bool,
47
47
optionalFunc:PropTypes.func,
@@ -50,50 +50,50 @@ MyComponent.propTypes = {
50
50
optionalString:PropTypes.string,
51
51
optionalSymbol:PropTypes.symbol,
52
52
53
-
//Anything that can be rendered: numbers, strings, elements or an array
54
-
// (or fragment) containing these types.
53
+
//Apapun dapat di-render: numbers, strings, elements ataupun sebuah array
54
+
// (atau fragmen) yang mengandung tipe-tipe tersebut.
55
55
optionalNode:PropTypes.node,
56
56
57
-
//A React element.
57
+
//Sebuah elemen React.
58
58
optionalElement:PropTypes.element,
59
59
60
-
//You can also declare that a prop is an instance of a class. This uses
61
-
//JS's instanceof operator.
60
+
//Anda dapat juga menyatakan bahwa sebuah prop adalah instance dari sebuah kelas. Ini menggunakan
61
+
//operator instanceof dari JS.
62
62
optionalMessage:PropTypes.instanceOf(Message),
63
63
64
-
//You can ensure that your prop is limited to specific values by treating
65
-
//it as an enum.
64
+
//Anda dapat memastikan bahwa prop anda dibatasi khusus untuk nilai tertentu dengan memperlakukan
65
+
//sebagai sebuah enum.
66
66
optionalEnum:PropTypes.oneOf(['News', 'Photos']),
67
67
68
-
//An object that could be one of many types
68
+
//Sebuah objek dapat memiliki satu dari banyak tipe-tipe
### Requiring Single Child {#requiring-single-child}
122
+
### Membutuhkan Satu Komponen Anak {#requiring-single-child}
123
123
124
-
With `PropTypes.element`you can specify that only a single child can be passed to a component as children.
124
+
Dengan menggunakan `PropTypes.element`anda dapat menentukan bahwa hanya menerima satu komponen anak yang dapat dikirimkan ke komponen lain.
125
125
126
126
```javascript
127
127
importPropTypesfrom'prop-types';
128
128
129
129
classMyComponentextendsReact.Component {
130
130
render() {
131
-
//This must be exactly one element or it will warn.
131
+
//Harus memiliki hanya satu elemen atau akan diberi peringatan.
132
132
constchildren=this.props.children;
133
133
return (
134
134
<div>
@@ -143,9 +143,9 @@ MyComponent.propTypes = {
143
143
};
144
144
```
145
145
146
-
### Default Prop Values {#default-prop-values}
146
+
### Nilai Default Prop {#default-prop-values}
147
147
148
-
You can define default values for your `props`by assigning to the special `defaultProps` property:
148
+
Anda dapat mendefinisikan nilai *default* untuk `props`dengan menambahkan properti khusus `defaultProps`:
149
149
150
150
```javascript
151
151
classGreetingextendsReact.Component {
@@ -156,19 +156,19 @@ class Greeting extends React.Component {
156
156
}
157
157
}
158
158
159
-
//Specifies the default values for props:
159
+
//Menentukan nilai default dari props:
160
160
Greeting.defaultProps= {
161
161
name:'Stranger'
162
162
};
163
163
164
-
//Renders "Hello, Stranger":
164
+
//Render "Hello, Stranger":
165
165
ReactDOM.render(
166
166
<Greeting />,
167
167
document.getElementById('example')
168
168
);
169
169
```
170
170
171
-
If you are using a Babel transform like [transform-class-properties](https://babeljs.io/docs/plugins/transform-class-properties/) , you can also declare `defaultProps`as static property within a React component class. This syntax has not yet been finalized though and will require a compilation step to work within a browser. For more information, see the [class fields proposal](https://github.com/tc39/proposal-class-fields).
171
+
Jika kamu menggunakan alat transformasi Babel seperti [transform-class-properties](https://babeljs.io/docs/plugins/transform-class-properties/) , kamu dapat mendeklarasikan `defaultProps`sebagai properti *static* dalam komponen kelas React. Sintaks ini belum final dan akan membutuhkan tahapan kompilasi untuk berjalan di browser. Informasi lebih lanjut, silakan lihat [proposal class fields](https://github.com/tc39/proposal-class-fields).
172
172
173
173
```javascript
174
174
classGreetingextendsReact.Component {
@@ -184,4 +184,4 @@ class Greeting extends React.Component {
184
184
}
185
185
```
186
186
187
-
The`defaultProps`will be used to ensure that `this.props.name`will have a value if it was not specified by the parent component. The `propTypes`typechecking happens after`defaultProps`are resolved, so typechecking will also apply to the`defaultProps`.
187
+
Properti`defaultProps`akan digunakan untuk memastikan bahwa `this.props.name`akan memiliki sebuah nilai jika tidak ada nilai yang diberikan oleh komponen induknya. Proses pengecekan tipe `propTypes`akan dijalankan setelah`defaultProps`berjalan, sehingga proses pengecekan tipe juga akan berlaku untuk`defaultProps`.
0 commit comments