Translate thinking in react page #25
Conversation
cuongtran8
changed the title
|
Deploy preview for vi-reactjs-org ready! Built with commit 74bb3b4 |
content/docs/thinking-in-react.md
Outdated
|
|
||
| Imagine that we already have a JSON API and a mock from our designer. The mock looks like this: | ||
| Tưởng tượng rằng chúng ta có một API và một bản mock từ người thiết kế. Bản mock trông như sau: |
There was a problem hiding this comment.
...chúng ta có một JSON API...Linh nghĩ chỗ này mình nên để chữ JSON vào translation.
There was a problem hiding this comment.
Cảm ơn Linh mình đã sửa lại
content/docs/thinking-in-react.md
Outdated
|
|
||
| But how do you know what should be its own component? Just use the same techniques for deciding if you should create a new function or object. One such technique is the [single responsibility principle](https://en.wikipedia.org/wiki/Single_responsibility_principle), that is, a component should ideally only do one thing. If it ends up growing, it should be decomposed into smaller subcomponents. | ||
| Nhưng làm thế nào để chia nhỏ giao diện thành những component? Hãy sử dụng những quy tắc khi bạn quyết định nên viết thêm một hàm hay tạo ra một object mới. Một trong những quy tắc đó là [quy tắc đơn nhiệm](https://en.wikipedia.org/wiki/Single_responsibility_principle) |
There was a problem hiding this comment.
chữ techniques ở đây mình nghĩ nên translate thành kĩ thuật thì đúng hơn. @nampdn cho ý kiến nha em.
There was a problem hiding this comment.
Cảm ơn Linh mình đã sửa lại
content/docs/thinking-in-react.md
Outdated
|
|
||
| You'll see here that we have five components in our simple app. We've italicized the data each component represents. | ||
| Có năm component trong ứng dựng, dữ liệu mà component hiển thị sẽ được in nghiêng |
There was a problem hiding this comment.
You'll see here that we have five components in our simple app. => Trong ứng dụng đơn giản dưới đây, bạn sẽ thấy chúng ta có 5 component.
There was a problem hiding this comment.
Cảm ơn Linh mình đã sửa lại
content/docs/thinking-in-react.md
Outdated
| 4. **`ProductCategoryRow` (turquoise):** displays a heading for each *category* | ||
| 5. **`ProductRow` (red):** displays a row for each *product* | ||
| 1. **`FilterableProductTable` (orange):** chứa toàn bộ cả ứng dụng | ||
| 2. **`SearchBar` (blue):** nơi *người dùng nhập dữ liệu* |
There was a problem hiding this comment.
receives all user input => nơi nhận tất cả dữ liệu người dùng nhập vào
There was a problem hiding this comment.
Cảm ơn Linh mình đã sửa lại
content/docs/thinking-in-react.md
Outdated
|
|
||
| If you look at `ProductTable`, you'll see that the table header (containing the "Name" and "Price" labels) isn't its own component. This is a matter of preference, and there's an argument to be made either way. For this example, we left it as part of `ProductTable` because it is part of rendering the *data collection* which is `ProductTable`'s responsibility. However, if this header grows to be complex (i.e. if we were to add affordances for sorting), it would certainly make sense to make this its own `ProductTableHeader` component. | ||
| Nhìn vào `ProductTable`, bạn sẽ thấy rằng tiêu đề cuả bảng (bao gồm những tiêu đề như "Name" và "Price") không được chia nhỏ thành các component. Đây là một tuỳ chọn mang tính cá nhânnhân, đã có những cuộc thảo luận về vấn đề này. Trong ví dụ, chúng ta để nó như là một phần của `ProductTable` bởi vì nó là một phần khi hiển thị *bảng dữ liệu* thuộc về `ProductTable`. Tuy nhiên, nếu như phần tiêu đề trở nên phức tạp (ví dụ nếu chúng ta thêm chức năng sắp xếp phân loại), thì tất nhiên sẽ hơp lí hơn khi có component `ProductTableHeader` cho phần tiêu đề. |
There was a problem hiding this comment.
Đây là một tuỳ chọn mang tính cá nhânnhân => Đây là một tuỳ chọn mang tính cá nhân
There was a problem hiding this comment.
Cảm ơn Linh mình đã sửa lại
No description provided.