Skip to content

Commit 91f8e5a

Browse files
hoyyChoilumirlumir
andauthored
docs: remove duplicated Recap in manipulating-the-dom-with-refs.md (#1221)
<!-- PR을 보내주셔서 감사합니다! 여러분과 같은 기여자들이 React를 더욱 멋지게 만듭니다! 기존 이슈와 관련된 PR이라면, 아래에 이슈 번호를 추가해주세요. --> # 중복된 요약 내용 제거 [Ref로 DOM 조작하기](https://ko.react.dev/learn/manipulating-the-dom-with-refs#recap) 문서의 요약 파트에 중복된 문장이 있어 이를 제거하였습니다. **수정 전** ``` - Ref는 범용적인 개념이지만 많은 경우 DOM 요소를 참조하기 위해 사용합니다. - `<div ref={myRef}>`로 React가 myRef.current에 DOM Node를 대입하도록 지시할 수 있습니다. - 많은 경우 ref는 포커싱, 스크롤링, DOM 요소 크기 혹은 위치 측정 등 비 파괴적인 행동을 위해 사용됩니다. - 컴포넌트는 기본적으로 DOM 노드를 노출하지 않습니다. `forwardRef`와 두 번째 `ref` 인자를 특정 노드에 전달하는 것으로 선택적으로 노출할 수 있습니다. - React가 관리하는 DOM 노드를 직접 바꾸려 하지 마세요. - React가 관리하는 DOM 노드를 수정하려 한다면, React가 변경할 이유가 없는 부분만 수정하세요. - Ref는 일반적인 개념이지만, 대부분의 경우 DOM 요소를 저장하는 데 사용됩니다. - React에 `<div ref={myRef}>`와 같이 작성하면, 해당 DOM 노드를 `myRef.current`에 넣도록 지시하는 것입니다. - 보통 ref는 DOM 요소에 포커스를 주거나, 스크롤하거나, 치수를 측정하는 등 DOM을 직접 변경하지 않고 상태를 유지하는 작업에 사용합니다. - 컴포넌트는 기본적으로 자신의 DOM 노드를 외부에 노출하지 않습니다. `ref` prop을 사용하여 DOM 노드를 노출하도록 선택할 수 있습니다. - React가 관리하는 DOM 노드를 직접 변경하는 것은 피하세요. - 꼭 React가 관리하는 DOM 노드를 수정해야 한다면, React가 업데이트할 이유가 없는 부분만 수정해야 합니다. ``` **수정 후** ``` - Ref는 일반적인 개념이지만, 대부분의 경우 DOM 요소를 저장하는 데 사용됩니다. - React에 `<div ref={myRef}>`와 같이 작성하면, 해당 DOM 노드를 `myRef.current`에 넣도록 지시하는 것입니다. - 보통 ref는 DOM 요소에 포커스를 주거나, 스크롤하거나, 치수를 측정하는 등 DOM을 직접 변경하지 않고 상태를 유지하는 작업에 사용합니다. - 컴포넌트는 기본적으로 자신의 DOM 노드를 외부에 노출하지 않습니다. `ref` prop을 사용하여 DOM 노드를 노출하도록 선택할 수 있습니다. - React가 관리하는 DOM 노드를 직접 변경하는 것은 피하세요. - 꼭 React가 관리하는 DOM 노드를 수정해야 한다면, React가 업데이트할 이유가 없는 부분만 수정해야 합니다. ``` ## 필수 확인 사항 - [x] [기여자 행동 강령 규약<sup>Code of Conduct</sup>](https://github.com/reactjs/ko.react.dev/blob/main/CODE_OF_CONDUCT.md) - [x] [기여 가이드라인<sup>Contributing</sup>](https://github.com/reactjs/ko.react.dev/blob/main/CONTRIBUTING.md) - [x] [공통 스타일 가이드<sup>Universal Style Guide</sup>](https://github.com/reactjs/ko.react.dev/blob/main/wiki/universal-style-guide.md) - [x] [번역을 위한 모범 사례<sup>Best Practices for Translation</sup>](https://github.com/reactjs/ko.react.dev/blob/main/wiki/best-practices-for-translation.md) - [x] [번역 용어 정리<sup>Translate Glossary</sup>](https://github.com/reactjs/ko.react.dev/blob/main/wiki/translate-glossary.md) - [x] [`textlint` 가이드<sup>Textlint Guide</sup>](https://github.com/reactjs/ko.react.dev/blob/main/wiki/textlint-guide.md) - [x] [맞춤법 검사<sup>Spelling Check</sup>](https://nara-speller.co.kr/speller/) ## 선택 확인 사항 - [ ] 번역 초안 작성<sup>Draft Translation</sup> - [ ] 리뷰 반영<sup>Resolve Reviews</sup> --------- Co-authored-by: 루밀LuMir <[email protected]>
1 parent 2ee4cb0 commit 91f8e5a

File tree

1 file changed

+4
-11
lines changed

1 file changed

+4
-11
lines changed

src/content/learn/manipulating-the-dom-with-refs.md

Lines changed: 4 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -649,19 +649,12 @@ DOM 요소를 직접 삭제한 뒤 `setState`를 사용하여 다시 DOM 노드
649649

650650
<Recap>
651651

652-
- Ref는 범용적인 개념이지만 많은 경우 DOM 요소를 참조하기 위해 사용합니다.
653-
- `<div ref={myRef}>`로 React가 myRef.current에 DOM Node를 대입하도록 지시할 수 있습니다.
654-
- 많은 경우 ref는 포커싱, 스크롤링, DOM 요소 크기 혹은 위치 측정 등 비 파괴적인 행동을 위해 사용됩니다.
655-
- 컴포넌트는 기본적으로 DOM 노드를 노출하지 않습니다. `forwardRef`와 두 번째 `ref` 인자를 특정 노드에 전달하는 것으로 선택적으로 노출할 수 있습니다.
656-
- React가 관리하는 DOM 노드를 직접 바꾸려 하지 마세요.
657-
- React가 관리하는 DOM 노드를 수정하려 한다면, React가 변경할 이유가 없는 부분만 수정하세요.
658-
659-
- Ref는 일반적인 개념이지만, 대부분의 경우 DOM 요소를 저장하는 데 사용됩니다.
652+
- Ref는 일반적인 개념이지만, 대부분의 경우 DOM 요소를 저장하는 데 사용합니다.
660653
- React에 `<div ref={myRef}>`와 같이 작성하면, 해당 DOM 노드를 `myRef.current`에 넣도록 지시하는 것입니다.
661-
- 보통 ref는 DOM 요소에 포커스를 주거나, 스크롤하거나, 치수를 측정하는 등 DOM을 직접 변경하지 않고 상태를 유지하는 작업에 사용합니다.
662-
- 컴포넌트는 기본적으로 자신의 DOM 노드를 외부에 노출하지 않습니다. `ref` prop을 사용하여 DOM 노드를 노출하도록 선택할 수 있습니다.
654+
- 대부분의 경우, Ref는 DOM 요소에 포커스를 주거나, 스크롤하거나, 치수를 측정하는 등 DOM을 직접 변경하지 않고 상태를 유지하는 작업에 사용합니다.
655+
- 컴포넌트는 기본적으로 자신의 DOM 노드를 외부에 노출하지 않습니다. `ref` Prop을 사용하여 DOM 노드를 선택적으로 노출할 수 있습니다.
663656
- React가 관리하는 DOM 노드를 직접 변경하는 것은 피하세요.
664-
- React가 관리하는 DOM 노드를 수정해야 한다면, React가 업데이트할 이유가 없는 부분만 수정해야 합니다.
657+
- 불가피하게 React가 관리하는 DOM 노드를 수정해야 한다면, React가 업데이트할 이유가 없는 부분만 수정해야 합니다.
665658

666659
</Recap>
667660

0 commit comments

Comments
 (0)