Skip to content

Commit 600768c

Browse files
authored
Merge pull request #174 from kctrnn/feature/translate-dont-call-proptypes
Translate Don't Call PropTypes Warning
2 parents c888c8a + b1e4677 commit 600768c

File tree

1 file changed

+22
-22
lines changed

1 file changed

+22
-22
lines changed

content/warnings/dont-call-proptypes.md

Lines changed: 22 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -4,47 +4,47 @@ layout: single
44
permalink: warnings/dont-call-proptypes.html
55
---
66

7-
> Note:
7+
> Chú ý:
88
>
9-
> `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).
9+
> `React.PropTypes` đã chuyển sang một gói khác kể từ React v15.5. Vui lòng sử dụng [thư viện `prop-types` thay thế](https://www.npmjs.com/package/prop-types).
1010
>
11-
>We provide [a codemod script](/blog/2017/04/07/react-v15.5.0.html#migrating-from-react.proptypes) to automate the conversion.
11+
>Chúng tôi cung cấp [tập lệnh codemod](/blog/2017/04/07/react-v15.5.0.html#migrating-from-react.proptypes) để tự động chuyển đổi.
1212
13-
In a future major release of React, the code that implements PropType validation functions will be stripped in production. Once this happens, any code that calls these functions manually (that isn't stripped in production) will throw an error.
13+
Trong một bản phát hành chính trong tương lai của React, code thực hiện các chức năng xác thực PropType sẽ bị loại bỏ trong quá trình sản xuất. Khi điều này xảy ra, bất kỳ code nào gọi các chức năng này theo cách thủ công (không bị loại bỏ trong quá trình sản xuất) sẽ gây ra lỗi.
1414

15-
### Declaring PropTypes is still fine {#declaring-proptypes-is-still-fine}
15+
### Khai báo PropTypes vẫn ổn {#declaring-proptypes-is-still-fine}
1616

17-
The normal usage of PropTypes is still supported:
17+
Việc sử dụng bình thường PropTypes vẫn được hỗ trợ:
1818

1919
```javascript
2020
Button.propTypes = {
2121
highlighted: PropTypes.bool
2222
};
2323
```
2424

25-
Nothing changes here.
25+
Không có gì thay đổi ở đây.
2626

27-
### Don’t call PropTypes directly {#dont-call-proptypes-directly}
27+
### Không gọi trực tiếp PropTypes {#dont-call-proptypes-directly}
2828

29-
Using PropTypes in any other way than annotating React components with them is no longer supported:
29+
Sử dụng PropTypes theo bất kỳ cách nào khác ngoài việc chú thích các React component với chúng không còn được hỗ trợ:
3030

3131
```javascript
3232
var apiShape = PropTypes.shape({
3333
body: PropTypes.object,
3434
statusCode: PropTypes.number.isRequired
3535
}).isRequired;
3636

37-
// Not supported!
37+
// Không được hỗ trợ!
3838
var error = apiShape(json, 'response');
3939
```
4040

41-
If you depend on using PropTypes like this, we encourage you to use or create a fork of PropTypes (such as [these](https://github.com/aackerman/PropTypes) [two](https://github.com/developit/proptypes) packages).
41+
Nếu bạn phụ thuộc vào việc sử dụng PropTypes như thế này, chúng tôi khuyến khích bạn sử dụng hoặc tạo một nhánh của PropTypes (chẳng hạn như 2 gói này [aackerman/PropTypes](https://github.com/aackerman/PropTypes) [developit/proptypes](https://github.com/developit/proptypes)).
4242

43-
If you don't fix the warning, this code will crash in production with React 16.
43+
Nếu bạn không khắc phục cảnh báo, code này sẽ gặp sự cố trong quá trình sản xuất với React 16.
4444

45-
### If you don't call PropTypes directly but still get the warning {#if-you-dont-call-proptypes-directly-but-still-get-the-warning}
45+
### Nếu bạn không gọi trực tiếp cho PropTypes nhưng vẫn nhận được cảnh báo {#if-you-dont-call-proptypes-directly-but-still-get-the-warning}
4646

47-
Inspect the stack trace produced by the warning. You will find the component definition responsible for the PropTypes direct call. Most likely, the issue is due to third-party PropTypes that wrap React’s PropTypes, for example:
47+
Kiểm tra stack trace được tạo ra bởi cảnh báo. Bạn sẽ thấy định nghĩa component chịu trách nhiệm cho cuộc gọi trực tiếp PropTypes. Rất có thể, vấn đề là do PropTypes của bên thứ ba bao bọc React’s PropTypes, ví dụ:
4848

4949
```js
5050
Button.propTypes = {
@@ -55,13 +55,13 @@ Button.propTypes = {
5555
}
5656
```
5757

58-
In this case, `ThirdPartyPropTypes.deprecated` is a wrapper calling `PropTypes.bool`. This pattern by itself is fine, but triggers a false positive because React thinks you are calling PropTypes directly. The next section explains how to fix this problem for a library implementing something like `ThirdPartyPropTypes`. If it's not a library you wrote, you can file an issue against it.
58+
Trong trường hợp này, `ThirdPartyPropTypes.deprecated` là một trình bao bọc gọi `PropTypes.bool`. Bản thân mô hình này là tốt, nhưng kích hoạt false positive React cho rằng bạn đang gọi trực tiếp PropTypes. Phần tiếp theo giải thích cách khắc phục sự cố này cho một thư viện triển khai thứ gì đó như `ThirdPartyPropTypes`. Nếu đó không phải là thư viện bạn đã viết, bạn có thể gửi vấn đề về thư viện đó.
5959

60-
### Fixing the false positive in third party PropTypes {#fixing-the-false-positive-in-third-party-proptypes}
60+
### Sửa lỗi false positive trong PropTypes của bên thứ ba {#fixing-the-false-positive-in-third-party-proptypes}
6161

62-
If you are an author of a third party PropTypes library and you let consumers wrap existing React PropTypes, they might start seeing this warning coming from your library. This happens because React doesn't see a "secret" last argument that [it passes](https://github.com/facebook/react/pull/7132) to detect manual PropTypes calls.
62+
Nếu bạn là tác giả của thư viện PropTypes của bên thứ ba và bạn để người tiêu dùng bọc các React PropTypes hiện có, họ có thể bắt đầu thấy cảnh báo này đến từ thư viện của bạn. Điều này xảy ra vì React không thấy đối số cuối cùng "bí mật" mà [nó chuyển qua](https://github.com/facebook/react/pull/7132) để phát hiện các lệnh gọi PropTypes thủ công.
6363

64-
Here is how to fix it. We will use `deprecated` from [react-bootstrap/react-prop-types](https://github.com/react-bootstrap/react-prop-types/blob/0d1cd3a49a93e513325e3258b28a82ce7d38e690/src/deprecated.js) as an example. The current implementation only passes down the `props`, `propName`, and `componentName` arguments:
64+
Đây là cách để sửa chữa nó. Chúng tôi sẽ sử dụng `deprecated` từ [react-bootstrap/react-prop-type](https://github.com/react-bootstrap/react-prop-types/blob/0d1cd3a49a93e513325e3258b28a82ce7d38e690/src/deprecated.js) làm ví dụ. Việc triển khai hiện tại chỉ chuyển xuống các đối số `props`, `propName` `componentName`:
6565

6666
```javascript
6767
export default function deprecated(propType, explanation) {
@@ -79,11 +79,11 @@ export default function deprecated(propType, explanation) {
7979
}
8080
```
8181

82-
In order to fix the false positive, make sure you pass **all** arguments down to the wrapped PropType. This is easy to do with the ES6 `...rest` notation:
82+
Để sửa lỗi false positive, hãy đảm bảo rằng bạn chuyển **tất cả** các đối số xuống PropType được bao bọc. Điều này rất dễ thực hiện với ký hiệu `...rest` của ES6:
8383

8484
```javascript
8585
export default function deprecated(propType, explanation) {
86-
return function validate(props, propName, componentName, ...rest) { // Note ...rest here
86+
return function validate(props, propName, componentName, ...rest) { // Chú ý ...rest ở đây
8787
if (props[propName] != null) {
8888
const message = `"${propName}" property of "${componentName}" has been deprecated.\n${explanation}`;
8989
if (!warned[message]) {
@@ -92,9 +92,9 @@ export default function deprecated(propType, explanation) {
9292
}
9393
}
9494

95-
return propType(props, propName, componentName, ...rest); // and here
95+
return propType(props, propName, componentName, ...rest); // và ở đây
9696
};
9797
}
9898
```
9999

100-
This will silence the warning.
100+
Điều này sẽ giúp xoá warning ở console.

0 commit comments

Comments
 (0)