더북(TheBook)

3.4.7 v-show와 v-if/v-else 비교

사용자와 개발자 모두에게 v-showv-if/v-else는 둘 다 장단점이 있습니다. 알다시피 v-show 지시자는 CSS를 사용해서 요소를 숨기거나 보여 주는 반면, v-if/v-else 지시자는 DOM에서 콘텐츠를 제거합니다. 그렇다면 언제 무엇을 쓸지는 무엇을 하고 싶은지에 달려 있습니다. 이 둘을 비교하는 가장 좋은 방법은 각각의 사용 예를 생각해 보는 것입니다.

v-show 지시자는 ‘다른(else)’ 사례가 없을 때 가장 적합합니다. 조건이 참일 때 보여 줄 마크업은 있는데, 거짓일 때 보여 줄 콘텐츠가 없을 때를 의미합니다. 다음은 v-show가 올바른 선택일 수 있는 사용 사례입니다.

세일 발표나 이용 약관의 변화 같은 일시적인 메시지 배너

사용자가 로그인하지 않았을 때 가입이나 기타 유도 광고

웹 페이지 하나로는 쓸 수 없는 여러 웹 페이지에서 사용하는 리스트 페이징 요소

신간 소식 구독하기
뉴스레터에 가입하시고 이메일로 신간 소식을 받아 보세요.