reactjs / ko.react.dev

React documentation website in Korean
https://ko.react.dev
Creative Commons Attribution 4.0 International
686 stars 418 forks source link

[Typo]: React로 사고하기 페이지 ConsoleBlock 요소 누락 #942

Closed wontory closed 2 weeks ago

wontory commented 3 weeks ago

Summary

https://github.com/reactjs/react.dev/blob/main/src/content/learn/thinking-in-react.md?plain=1

442번~446번 줄의 ConsoleBlock 요소가 누락되어있습니다.

Page

https://ko.react.dev/learn/thinking-in-react

Details

Step 4: State가 어디에 있어야 할 지 정하기

CleanShot 2024-06-09 at 00 44 56@2x

https://github.com/reactjs/ko.react.dev/blob/main/src/content/learn/thinking-in-react.md?plain=1 436번째 줄 ~

아직 폼을 수정하는 작업이 작동하지 않음을 유의하세요. 위의 샌드박스에서 콘솔 에러가 발생하고 그 이유를 설명하겠습니다.

현재 `onChange` 핸들러 없이 폼의 필드에 `value` prop을 전달하였습니다. 이렇게 하면 읽기 전용 필드가 렌더링 됩니다.

위에 있는 샌드박스를 보면, `ProductTable`와 `SearchBar`가 `filterText`와 `inStockOnly` props를 table, input과 체크 박스를 렌더하기 위해서 읽고 있습니다. 예를 들면, `SearchBar` input의 value를 아래와 같이 채우고 있습니다.

 


 

Step 4: Identify where your state should live

CleanShot 2024-06-09 at 00 45 11@2x

https://github.com/reactjs/react.dev/blob/main/src/content/learn/thinking-in-react.md?plain=1 440번째 줄 ~

Notice that editing the form doesn't work yet. There is a console error in the sandbox above explaining why:

<ConsoleBlock level="error">

You provided a \`value\` prop to a form field without an \`onChange\` handler. This will render a read-only field.

</ConsoleBlock>

In the sandbox above, `ProductTable` and `SearchBar` read the `filterText` and `inStockOnly` props to render the table, the input, and the checkbox. For example, here is how `SearchBar` populates the input value:
hg-pyun commented 2 weeks ago

오 감사합니다. 요거 머지하다가 누락시켰던거 같기도하고..ㅠㅠ