인프런 커뮤니티 질문&답변
작성한 질문수
섹션 5 - Events 강의, v-model computed 생성 문의드립니다
해결된 질문
작성
·
478
0
- 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요!
- 먼저 유사한 질문이 있었는지 검색해보세요.
- 서로 예의를 지키며 존중하는 문화를 만들어가요.
- 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요.
안녕하세요 강사님. 강의 너무 재밌게 잘 듣고 있습니다. 지금 emit을 다루는 영상 파트를 보고 있습니다. 보다보니 머리가 좀 복잡하긴 한데 쭉 정리를 하다가 문득 궁금한게 있어 질문드립니다.
강의에서도 말씀해주셨듯이 v-model을 만들 때 comptued로도 생성할 수 있고, 실습까지도 다 마쳤는데요.
개인적으로 궁금한 부분은 업무에서는 보통 v-model 구현 시 computed를 사용하는지 혹은 :value, $emit 이벤트로 구현하는지 궁금합니다.
그리고 상황에 맞게 쓰인다면 어떤 차이점이 있을까요?
감사합니다.
답변 2
1
안녕하세요 :)
제 답변이 늦었네요. 죄송합니다 🥲 "인프런 AI 인턴"답변에 추가로 말씀 드리면 ,
저는 코드 재사용성, 간결함등의 이유로 computed로 하는 것을 선호합니다. 하지만 갯수가 많아지면 오히려 코드의 양이 늘어날 수 있기에 :value, $emit을 사용하기도 해요.
추가로 언급 드리면 Vue3.3 에서는 "실험적인 기능"으로 defineModel 이라는 스펙이 나왔는데요.
defineModel을 이용하여 Custom v-model을 보다 간결하게 구현할 수 있습니다.
(실험적인 기능이니 참고만 해두세요)
https://blog.vuejs.org/posts/vue-3-3#definemodel (참고링크)
답변이 늦어 다시 한번 사과말씀전해드립니다. 💪
1
안녕하세요, 인프런 AI 인턴이에요. v-model을 사용할 때 computed로도 생성할 수 있고, :value와 $emit 이벤트로 구현할 수도 있습니다.
v-model을 구현할 때 computed를 사용하면 보다 간편하게 데이터를 처리할 수 있습니다. computed를 사용하면 각종 필터링, 변환, 연산 등을 추가로 처리할 수 있어 가독성과 재사용성을 높일 수 있습니다.
반면에 :value와 $emit 이벤트를 사용하면 부모 컴포넌트에서 자식 컴포넌트로 props로 값을 전달하고, 자식 컴포넌트에서 업데이트된 값을 다시 부모 컴포넌트로 전달하는 방식입니다. 이렇게 구현하는 경우에는 자식 컴포넌트를 직접 제어할 수 있어 좀 더 유연한 로직을 구현할 수 있습니다.
어떤 방식을 선택하느냐는 상황과 개발자의 선호도에 따라 다를 수 있습니다. computed를 사용하면 간편하고 가독성이 좋고, :value와 $emit를 사용하면 더 세밀한 조작이 가능하다는 장점이 있습니다. 상황에 따라 어떤 방식이 더 효율적인지 판단하시면 될 것 같아요. 어떤 방식을 선택하더라도 애플리케이션을 구현하는 데 지장이 없으니 참고하셔서 사용하시면 될 것 같습니다. 감사합니다.