codestates / codestates/BanThing
[Error Handling] My Page 의 제어 컴포넌트(Controlled Component) 관련 에러
- Dominant language
- TypeScript
- Stars
- 0
- Forks
- 2
- PR merge metrics
- No merged PRs in 30d
Description
### 어떤 에러인가요?
- 페이지를 구성하는 컴포넌트 내에서 임의의 값이 제어되지 않는 경우 발생하는 에러입니다.

- Client 상의 코드는 아래와 같습니다.
```javascript
```
- `userId` 는 React 의 useState 를 통해 상태로 관리되며,
useEffect 를 통해 My Page 가 최초로 렌더링될 때 axios 요청을 통해 서버에서 받은 응답 중
사용자의 아이디에 해당하는 값을 `setUserId` 라는 상태변경 함수를 통해 `userId` 에 할당합니다.
- 하지만 서버상의 에러 혹은 클라이언트 상의 잘못된 요청으로 사용자의 아이디에 해당하는 값이 `undefined` 가 될 수 있기에
위의 코드는 value 의 값이 `undefined` 가 되어 예상치 못한 즉, 제어되지 않은 값을 지닐 수 있습니다.
- 그렇기에 컴포넌트 상의 값이 제어되지 않았다는 에러 문구가 나타난 것입니다.
### 에러 핸들링 방법
- 간단하게, `userId` 가 `undefined` 라는 값을 가지는 경우를 value 에 작성해주면 됩니다.
```javascript
```
- 위와 같이 `||` 를 통해 값이 제어되도록 설정하면 에러 문구가 더 이상 나타나지 않습니다 :)
### 에러 핸들링을 위해 참고한 레퍼런스 링크
- StackOverflow 의 QnA 를 참고하였습니다.
[StackOverflow](https://stackoverflow.com/questions/47012169/a-component-is-changing-an-uncontrolled-input-of-type-text-to-be-controlled-erro)
Contributor guide
No contributing guide indexed for this repository
Assessment
This issue has not been assessed yet.