Skip to content

Commit 69e0147

Browse files
authored
Merge pull request #198 from lequangnamsoraly2009/translate/warning-unknown-prop
translate warnings/unknown-prop.md
2 parents 7780450 + e8e035b commit 69e0147

File tree

1 file changed

+19
-12
lines changed

1 file changed

+19
-12
lines changed

content/warnings/unknown-prop.md

Lines changed: 19 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -3,37 +3,44 @@ title: Unknown Prop Warning
33
layout: single
44
permalink: warnings/unknown-prop.html
55
---
6-
The unknown-prop warning will fire if you attempt to render a DOM element with a prop that is not recognized by React as a legal DOM attribute/property. You should ensure that your DOM elements do not have spurious props floating around.
76

8-
There are a couple of likely reasons this warning could be appearing:
7+
Cảnh báo unknown-prop sẽ xuất hiện nếu bạn đang cố gắng để render một DOM element với một prop không được React công nhận như một thuộc tính(attribute/property) DOM
8+
hợp pháp.Bạn nên đảm bảo rằng các DOM elements của bạn không có các props giả mạo trôi nổi xung quanh.
99

10-
1. Are you using `{...this.props}` or `cloneElement(element, this.props)`? Your component is transferring its own props directly to a child element (eg. [transferring props](/docs/transferring-props.html)). When transferring props to a child component, you should ensure that you are not accidentally forwarding props that were intended to be interpreted by the parent component.
10+
Có một số lý do có thể khiến cho cảnh báo này xuất hiện:
1111

12-
2. You are using a non-standard DOM attribute on a native DOM node, perhaps to represent custom data. If you are trying to attach custom data to a standard DOM element, consider using a custom data attribute as described [on MDN](https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Using_data_attributes).
12+
1. Bạn có đang sử dụng `{...this.props}` hoặc `cloneElement(element, this.props)` không? Component của bạn đang chuyển các props của chính nó sang một element con
13+
(ví dụ: [transferring props](/docs/transferring-props.html)). Khi chuyển các props sang một component con, bạn nên đảm bảo rằng bạn không vô tình chuyển tiếp các props
14+
được component cha dự định thông dịch.
1315

14-
3. React does not yet recognize the attribute you specified. This will likely be fixed in a future version of React. However, React currently strips all unknown attributes, so specifying them in your React app will not cause them to be rendered.
1516

16-
4. You are using a React component without an upper case. React interprets it as a DOM tag because [React JSX transform uses the upper vs. lower case convention to distinguish between user-defined components and DOM tags](/docs/jsx-in-depth.html#user-defined-components-must-be-capitalized).
17+
2. Bạn đang sử dụng một thuộc tính DOM không tiêu chuẩn trên một DOM node gốc, có lẽ là đại diện cho một data tùy chỉnh. Nếu bạn đang cố gắng đính kèm data tùy chỉnh
18+
vào một DOM element tiêu chuẩn, bạn có thể xem xét sử dụng thuộc tính data tùy chỉnh như đã được mô tả trên [MDN](https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Using_data_attributes).
19+
20+
3. React chưa thể nhận ra thuộc tính mà bạn đã chỉ định. Điều này có thể được khắc phục trong một phiên bản React mới trong tương lai. Tuy nhiên, React hiện tại sẽ
21+
loại bỏ tất cả các thuộc tính không được xác định, vì vậy việc bạn chỉ định chúng trong ứng dụng React của bạn sẽ khiến chúng không được render.
22+
23+
4. Bạn đang sử dụng một React component mà không có chữ hoa. React sẽ hiểu nó như một thẻ DOM bởi vì [React JSX Transform sử dụng quy ước chữ hoa và chữ thường để phân biệt giữa các components do người dùng tự định nghĩa và các thẻ DOM](/docs/jsx-in-depth.html#user-defined-components-must-be-capitalized).
1724

1825
---
1926

20-
To fix this, composite components should "consume" any prop that is intended for the composite component and not intended for the child component. Example:
27+
Để khắc phục điều này, các composite components nên "sử dụng hết" bất kỳ prop nào dành cho composite component và không dành cho component con. Ví dụ:
2128

22-
**Bad:** Unexpected `layout` prop is forwarded to the `div` tag.
29+
**Tệ:** Prop `layout` không mong muốn đã được chuyển tiếp đến thẻ `div`.
2330

2431
```js
2532
function MyDiv(props) {
2633
if (props.layout === 'horizontal') {
27-
// BAD! Because you know for sure "layout" is not a prop that <div> understands.
34+
// TỆ! Bởi vì bạn biết chắc chắn rằng "layout" không phải là một prop mà thẻ <div> có thể hiểu được.
2835
return <div {...props} style={getHorizontalStyle()} />
2936
} else {
30-
// BAD! Because you know for sure "layout" is not a prop that <div> understands.
37+
// TỆ! Bởi vì bạn biết chắc chắn rằng "layout" không phải là một prop mà thẻ <div> có thể hiểu được.
3138
return <div {...props} style={getVerticalStyle()} />
3239
}
3340
}
3441
```
3542

36-
**Good:** The spread operator can be used to pull variables off props, and put the remaining props into a variable.
43+
**Tốt:** Toán tử spread có thể được sử dụng để lấy ra các biến trong props ra và đặt lại các props còn lại vào một biến.
3744

3845
```js
3946
function MyDiv(props) {
@@ -46,7 +53,7 @@ function MyDiv(props) {
4653
}
4754
```
4855

49-
**Good:** You can also assign the props to a new object and delete the keys that you're using from the new object. Be sure not to delete the props from the original `this.props` object, since that object should be considered immutable.
56+
**Tốt:** Bạn có thể gán các props cho một object mới và xóa các keys mà bạn đang sử dụng ra khỏi object mới. Đảm bảo rằng bạn không xóa các props ra khỏi object `this.props` ban đầu, vì object đó sẽ được coi là bất biến/không thể thay đổi (immutable)
5057

5158
```js
5259
function MyDiv(props) {

0 commit comments

Comments
 (0)