diff --git a/src/content/learn/passing-data-deeply-with-context.md b/src/content/learn/passing-data-deeply-with-context.md index 38b0520de..9becc90fa 100644 --- a/src/content/learn/passing-data-deeply-with-context.md +++ b/src/content/learn/passing-data-deeply-with-context.md @@ -214,13 +214,13 @@ Context는 부모가 트리 내부 전체에, 심지어 멀리 떨어진 컴포 -Using context in close children +Context를 가까운 자식 컴포넌트에서 사용하기 -Using context in distant children +Context를 먼 자식 컴포넌트에서 사용하기 @@ -478,8 +478,6 @@ export default function Section({ level, children }) { 이것은 React에게 `Section` 내의 어떤 컴포넌트가 `LevelContext`를 요구하면 `level`을 주라고 알려줍니다. 컴포넌트는 그 위에 있는 UI 트리에서 가장 가까운 ``의 값을 사용합니다. -This tells React: "if any component inside this `
` asks for `LevelContext`, give them this `level`." The component will use the value of the nearest `` in the UI tree above it. - ```js @@ -572,10 +570,6 @@ export const LevelContext = createContext(1); 2. `Section`은 자식을 ``로 감싸줍니다. 3. `Heading`은 `useContext(LevelContext)`를 사용해 가장 근처의 `LevelContext`의 값을 요청합니다. -1. You pass a `level` prop to the `
`. -2. `Section` wraps its children into ``. -3. `Heading` asks the closest value of `LevelContext` above with `useContext(LevelContext)`. - ## 같은 컴포넌트에서 context를 사용하며 제공하기 {/*using-and-providing-context-from-the-same-component*/} 지금은 각각의 섹션에 `level`을 수동으로 지정해야 합니다. @@ -879,15 +873,6 @@ Context는 정적인 값으로 제한되지 않습니다. 다음 렌더링 시 - Context를 활용해 "주변에 적응하는" 컴포넌트를 작성할 수 있습니다. - Context를 사용하기 전에 props를 전달하거나 JSX를 `children`으로 전달하는 것을 먼저 시도해보세요. -* Context lets a component provide some information to the entire tree below it. -* To pass context: - 1. Create and export it with `export const MyContext = createContext(defaultValue)`. - 2. Pass it to the `useContext(MyContext)` Hook to read it in any child component, no matter how deep. - 3. Wrap children into `` to provide it from a parent. -* Context passes through any components in the middle. -* Context lets you write components that "adapt to their surroundings". -* Before you use context, try passing props or passing JSX as `children`. -