diff --git a/content/community/support.md b/content/community/support.md index 2a5454d32..55393365a 100644 --- a/content/community/support.md +++ b/content/community/support.md @@ -24,18 +24,11 @@ Có rất nhiều diễn đàn online là nơi tuyệt vời để thảo luận Mỗi cộng đồng bao gồm hàng nghìn người dùng React. -<<<<<<< HEAD * [Cộng đồng React của DEV](https://dev.to/t/react) * [Cộng đồng React của Hashnode](https://hashnode.com/n/reactjs) * [Trò chuyện online với Reactiflux](https://discord.gg/reactiflux) * [Cộng đồng React của Reddit](https://www.reddit.com/r/reactjs/) * [Cộng đồng React của Spectrum](https://spectrum.chat/react) -======= -* [DEV's React community](https://dev.to/t/react) -* [Hashnode's React community](https://hashnode.com/n/reactjs) -* [Reactiflux online chat](https://discord.gg/reactiflux) -* [Reddit's React community](https://www.reddit.com/r/reactjs/) ->>>>>>> 9b3c3f4e613440baf2e2f1775be65dac8c08ab5f ## Tin tức {#news} diff --git a/content/docs/add-react-to-a-website.md b/content/docs/add-react-to-a-website.md index bb362bd8d..efcae3574 100644 --- a/content/docs/add-react-to-a-website.md +++ b/content/docs/add-react-to-a-website.md @@ -149,11 +149,7 @@ return ( Hai đoạn code trên là tương đương nhau. Trong khi **JSX [hoàn toàn là tuỳ chọn](/docs/react-without-jsx.html)**, nhiều người thấy rằng nó khá hữu ích cho việc viết UI code -- cả với React và với các thư viện khác. -<<<<<<< HEAD -Bạn có thể trải nghiệm với JSX bằng cách sử dụng [bộ chuyển đổi online](https://babeljs.io/en/repl#?babili=false&browsers=&build=&builtIns=false&spec=false&loose=false&code_lz=DwIwrgLhD2B2AEcDCAbAlgYwNYF4DeAFAJTw4B88EAFmgM4B0tAphAMoQCGETBe86WJgBMAXJQBOYJvAC-RGWQBQ8FfAAyaQYuAB6cFDhkgA&debug=false&forceAllTransforms=false&shippedProposals=false&circleciRepo=&evaluate=false&fileSize=false&timeTravel=false&sourceType=module&lineWrap=true&presets=es2015%2Creact%2Cstage-2&prettier=false&targets=&version=7.4.3). -======= -You can play with JSX using [this online converter](https://babeljs.io/en/repl#?babili=false&browsers=&build=&builtIns=false&spec=false&loose=false&code_lz=DwIwrgLhD2B2AEcDCAbAlgYwNYF4DeAFAJTw4B88EAFmgM4B0tAphAMoQCGETBe86WJgBMAXJQBOYJvAC-RGWQBQ8FfAAyaQYuAB6cFDhkgA&debug=false&forceAllTransforms=false&shippedProposals=false&circleciRepo=&evaluate=false&fileSize=false&timeTravel=false&sourceType=module&lineWrap=true&presets=es2015%2Creact%2Cstage-2&prettier=false&targets=&version=7.15.7). ->>>>>>> 9b3c3f4e613440baf2e2f1775be65dac8c08ab5f +Bạn có thể trải nghiệm với JSX bằng cách sử dụng [bộ chuyển đổi online](https://babeljs.io/en/repl#?babili=false&browsers=&build=&builtIns=false&spec=false&loose=false&code_lz=DwIwrgLhD2B2AEcDCAbAlgYwNYF4DeAFAJTw4B88EAFmgM4B0tAphAMoQCGETBe86WJgBMAXJQBOYJvAC-RGWQBQ8FfAAyaQYuAB6cFDhkgA&debug=false&forceAllTransforms=false&shippedProposals=false&circleciRepo=&evaluate=false&fileSize=false&timeTravel=false&sourceType=module&lineWrap=true&presets=es2015%2Creact%2Cstage-2&prettier=false&targets=&version=7.15.7). ### Thử nhanh JSX {#quickly-try-jsx} diff --git a/content/docs/hooks-faq.md b/content/docs/hooks-faq.md index 3b46f91e0..0917a74c3 100644 --- a/content/docs/hooks-faq.md +++ b/content/docs/hooks-faq.md @@ -912,9 +912,13 @@ Lưu ý bạn có thể chọn giữa truyền *state* của ứng dụng xuốn >Lưu ý > +<<<<<<< HEAD >Chúng tôi đề xuất [truyền `dispatch` xuống các context](#how-to-avoid-passing-callbacks-down) thay vì các callback độc lập qua prop. Cách tiếp cận bên dưới chỉ đề cập ở đây để đầy đủ và như là một cách hatch. > >Cũng lưu ý rằng pattern này có thể gây ra vấn đề trong [chế độ concurrent ](/blog/2018/03/27/update-on-async-rendering.html). Chúng tôi có kế hoạch cung cấp một cách làm khác hữu hiệu trong tương lai, nhưng giải pháp an toàn nhất hiện nay là luôn luôn vô hiệu hóa callback nếu một vài giá trị phụ thuộc vào thay đổi. +======= +>We recommend to [pass `dispatch` down in context](#how-to-avoid-passing-callbacks-down) rather than individual callbacks in props. The approach below is only mentioned here for completeness and as an escape hatch. +>>>>>>> 4133943e718a77f11627888db2f59f6cb7a73403 Trong vài trường hợp các biệt, bạn cần nhớ 1 callback với [`useCallback`](/docs/hooks-reference.html#usecallback) nhưng việc nhớ này không làm việc tốt bởi vì hàm bên trong bị re-create quá nhiều lần. Nếu hàm bạn nhớ là một hàm xử lý sự kiện và không được sử dụng trong quá trình render, bạn có thể sử dụng [ref như một biến instance](#is-there-something-like-instance-variables), và lưu giá trị lần commit sau cùng một cách thủ công: diff --git a/content/docs/thinking-in-react.md b/content/docs/thinking-in-react.md index bc8afc8ae..fc3c2279c 100644 --- a/content/docs/thinking-in-react.md +++ b/content/docs/thinking-in-react.md @@ -73,7 +73,7 @@ Sau khi kết thúc, bạn sẽ có những thư viện có thể tái sử dụ Tham khảo [tài liệu React](/docs/) nếu như bạn cần trợ giúp để thực hiện bước này. -### Bản tóm tắt ngắn gọn: Props và State {#a-brief-interlude-props-vs-state} +Xem [React docs](/docs/getting-started.html) nếu bạn cần trợ giúp ở bước này. Có 2 kiểu "mô hình" dữ liệu trong React: props và state. Hiểu ra sự khác biệt giữa prop và state là điều rất quan trọng; Tham khảo [Những tài liệu từ React](/docs/state-and-lifecycle.html) nếu bạn thực sự không hiểu ra sự khác biệt đó. Xem thêm phần [FAQ: Sự khác nhau giữa prop và state là gì?](/docs/faq-state.html#what-is-the-difference-between-state-and-props) @@ -138,11 +138,7 @@ React làm cho luồng dữ liệu trở nên rõ ràng và dễ hiểu hơn ch Nếu bạn thử gõ hoặc lựa chọn giá trị trong ví dụ hiện thời, bạn sẽ thấy rằng React bỏ qua những giá trị đầu vào này. Điều này sảy ra có chủ ý, vì chúng ta gán `value` prop của `input` luôn luôn bằng với `state` truyền từ `FilterableProductTable`. -<<<<<<< HEAD Hãy nghĩ xem chúng ta muốn thực hiện điều gì. Chúng ta muốn chắc chắn rằng khi nào người dùng thay đổi form, chúng ta cập nhật state dựa trên dữ liệu đầu vào. Vì những component chỉ nên cập nhật state cuả chúng, `FilterableProductTable` sẽ truyền vào callbacks tới `SearchBar` để kích hoạt mỗi khi dữ liệu cần cập nhật. Chúng ta có thể sử dụng sự kiện `onChange` trong input để nhận được thông báo. Callbacks truyền xuống bởi `FilterableProductTable` sẽ gọi hàm `setState()`, và ứng dụng sẽ được cập nhật. -======= -If you try to type or check the box in the previous version of the example (step 4), you'll see that React ignores your input. This is intentional, as we've set the `value` prop of the `input` to always be equal to the `state` passed in from `FilterableProductTable`. ->>>>>>> 9b3c3f4e613440baf2e2f1775be65dac8c08ab5f Mặc dù nó nghe phức tạp, nhưng thật ra chỉ cần vài dòng lệnh. Và nó chỉ ra rất rõ ràng luồng dữ liệu được truyền đi trong ứng dụng như thế nào. diff --git a/content/tutorial/tutorial.md b/content/tutorial/tutorial.md index 95bfc1b48..d97e39125 100644 --- a/content/tutorial/tutorial.md +++ b/content/tutorial/tutorial.md @@ -1045,13 +1045,8 @@ Hãy `map` mảng `history` trong phương thức `render` của Game component: **[Xem code chi tiết tại bước này](https://codepen.io/gaearon/pen/EmmGEa?editors=0010)** -<<<<<<< HEAD Với mỗi lịch sử bước đi trong game tic-tac-toe, ta tạo ra một danh sách các `
  • ` chứa một `