reactjs / reactjs/react.dev

Clarification about multiple contexts on "Scaling Up with Reducer and Context" documentation page

Đang mở
#5,175 1 bình luận 3 reaction 0 người được giao Xem trên GitHub

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

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ả

Hi, new react docs are great. I had a question about the sample code in Scaling Up with Reducer and Context. I hope this is a reasonable way to provide feedback on a specific page. I did a quick issue search and didn't find anything related. Here is some of the sample code:

import { TasksContext, TasksDispatchContext } from './TasksContext.js';

export default function TaskApp() {
  const [tasks, dispatch] = useReducer(tasksReducer, initialTasks);
  // ...
  return (
    <TasksContext.Provider value={tasks}>
      <TasksDispatchContext.Provider value={dispatch}>
        ...
      </TasksDispatchContext.Provider>
    </TasksContext.Provider>
  );
}

It's interesting that you chose that style vs:


```js
import { TasksContext, TasksDispatchContext } from './TasksContext.js';

export default function TaskApp() {
  const [tasks, dispatch] = useReducer(tasksReducer, initialTasks);
  // ...
  return (
    <TasksContext.Provider value={{ tasks, dispatch }}>
        ...
    </TasksContext.Provider>
  );
}

If I understand correctly, the benefit of multiple contexts comes in when I've memoized a component that is a child of our contexts, and then I want to use dispatch inside that child component without subscribing to changes to tasks.

This seems either important to elaborate on in the documentation page, or if you don't want to make the page more complex, maybe it'd be simpler for everyone to just use one context? One potential problem with the sample code you've chosen to share, and without explanation, is that it suggests the use of a lot of contexts, one for every bit of data you might want to share, which can lead to overwrought code in my opinion.

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

Bắt đầu với trang “Scaling Up with Reducer and Context” và sample được liên kết trong đó, đặc biệt là TaskApp và TasksContext.js. So sánh các ví dụ dùng context riêng biệt và context duy nhất, sau đó xác định trang cần có phần giải thích hoặc hướng dẫn nào để người đọc hiểu được sự đánh đổi và khi nào sample này phù hợp.

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ó
3/5
Thời gian dự kiến
1-2 ngày
Mức độ hoạt động
Đình trệ
Độ rõ ràng
Cần làm rõ
Mức phù hợp với người mới
35/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.