reactjs / reactjs/react.dev

[Suggestion]: Adding an Explanation Text to Avoid any Confusion

Đang mở Phù hợp với người mới
#6,733 0 bình luận 0 reaction 0 người được giao Xem trên GitHub

Chưa có ai nhận issue này.

type: documentation
Ngôn ngữ chính
JavaScript
Star
11.8k
Fork
7.9k
Merge trung bình
1 ngày 11 giờ
Pull request đã merge (30 ngày)
11

Mô tả

Summary

Add an explanation text to avoid any confusion about the fact that it's the component's internal state changes, not the props themselves, that actually trigger the render (cf : the Big Re-renders Myth as mentioned by Nadia Makarevich).

Page

https://react.dev/learn/render-and-commit

Details

Section : "Step 3: React commits changes to the DOM"

In this section, there is a sentence which could create some confusion for a new React Developer.
Indeed, even if it is recalled various times in this page, this sentence could bring some confusion since it is not clearly established that a re-render is triggered by state changes instead of props. Therefore, I suggest to add some short explanations to explicitly clarify this distinction.
This is also a good way to create a common thread with the next page "State as a Snapshot".

Moreover, the playground doesn't help to understand this distinction since we don't use any useState hook in this component but in the parent component (we have to fork it to see all the components):
image

  • The original sentences :

React only changes the DOM nodes if there’s a difference between renders. For example, here is a component that re-renders with different props passed from its parent every second.

  • The additional sentence :
    It's worth noting that although props are updated, it's the component's internal state changes that actually trigger the render.

Hướng dẫn đóng góp

Mở hướng dẫn đóng góp

Bắt đầu từ đâu

  1. Đọc hết issue, rồi đọc hướng dẫn đóng góp của dự án.
  2. Bình luận trên issue rằng bạn sẽ nhận — tránh hai người làm cùng một việc.
  3. Fork repository và làm thay đổi trên một nhánh.
  4. Mở pull request có tham chiếu số hiệu của issue.

Hướng nghiên cứu

Mở trang react.dev/learn/render-and-commit và kiểm tra “Step 3: React commits changes to the DOM”, đặc biệt là câu nói về việc render lại với các props khác nhau và playground của câu đó. So sánh trang này với trang “State as a Snapshot” được liên kết, sau đó cập nhật phần giải thích để sự khác biệt được rõ ràng và xác minh bản xem trước tài liệu cùng các liên kết.

Do mô hình lập chỉ mục viết ra từ nội dung của issue.

Đánh giá

Công nghệ
javascript, react
Lĩnh vực
documentation
Loại issue
Tài liệu
Độ khó
2/5
Thời gian dự kiến
1-3 giờ
Mức độ hoạt động
Đình trệ
Độ rõ ràng
Đặc tả rõ ràng
Mức phù hợp với người mới
62/100

Nhận issue mới trong hộp thư của bạn

Bản tóm tắt ngắn những issue GitHub phù hợp với người mới.