강의

멘토링

커뮤니티

인프런 커뮤니티 질문&답변

산독기님의 프로필 이미지
산독기

작성한 질문수

한 입 크기로 잘라먹는 실전 프로젝트 - SNS 편

(9.4) 프로필 수정 기능 구현하기 - 기능

setAvatarImage(null) 부분 질문

작성

·

8

0

선생님, 안녕하세요. 강의 잘 듣고 있습니다 🙂

프로필 수정 기능구현하기 - 기능 강좌에서

 

  useEffect(() => {     if (profile && isOpen) {       setNickname(profile.nickname);       setBio(profile.bio);       setAvatarImage(null);     }   }, [profile, isOpen]);
setAvatarImage(null);

setAvatarImage의 인수로 null 값으로 설정한 이유를 강의에서 말씀 주셨는데 설명을 들었는데도 아직 잘 이해가 안 돼서요 ㅠㅠ

해당 부분에 대해 좀 더 부연설명 해주실 수 있나요?

 

감사합니다. 새해 복 많이 받으세요!

답변 1

0

안녕하세요, 인프런 AI 인턴입니다. 산독기님, 질문 주셔서 감사합니다.

주어진 코드 스니펫에서 setAvatarImage(null);는 프로필 수정 모달이 열리면서 사용자 프로필을 원래의 초기 상태로 설정하려는 의도를 가지고 있습니다. 여기서 null을 설정하는 이유와 의도는 다음과 같습니다:

  • 상태 초기화: 프로필 수정 모달이 열릴 때, 이전에 설정되었던 이미지가 남아 있게 되면 사용자가 혼란스러울 수 있습니다. 즉, 새로운 이미지를 업로드하려는 경우에 초기 상태로 돌아가기 위해 기존의 이미지를 null로 설정함으로써 초기화하고 있음을 의미합니다.

  • UI 업데이트: null로 설정함으로써 프로필에서 이전에 설정된 아바타 이미지가 없어지거나, 기본 이미지로 돌아가게 됩니다. 이는 UI에서 이전 이미지를 명확하게 제거하는 데 도움이 됩니다.

  • 사용자 경험 향상: 사용자가 새로운 이미지를 설정하고자 할 때 매번 초기 상태(아무 것도 선택하지 않았던 상태)로 돌아가게 함으로써 사용자에게 명확한 선택지(무엇을 했는지에 대한)가 제공됩니다.

이를 통해 변화된 상태에 대해 명확히 하여 사용자가 프로필 수정 과정에서 혼동하지 않고, 보다 직관적인 경험을 할 수 있습니다.

관련된 질문에 답변한 유사한 질문과 답변을 아래 링크에서 확인하실 수 있습니다:

이러한 링크들이 질문자의 이해도를 높이는 데 도움이 되기를 바랍니다.

저는 질문자님의 이해를 돕고자 지식공유자님의 기존 답변을 참고하여 유사한 답변 링크를 추천해드리고 있습니다. 현재 베타 기능으로 답변이 만족스럽지 않을 수 있는 점 양해 부탁드립니다. 🙏 추가적으로 궁금한 점이 있으시면, 이어서 질문해 주세요. 곧 지식공유자께서 답변해 주실 것입니다.

산독기님의 프로필 이미지
산독기

작성한 질문수

질문하기