vue.js 조건부 렌더링

수다왕

프로필 보기 이 회원 글보기 이 회원의 댓글보기

· 6년 전 · 조회 2105 2105

조건부 렌더링

v-if

Handlebars와 같은 문자열 템플릿에서는 다음과 같은 조건부 블록을 작성할 수 있습니다.

HTML부분

{{#if ok}}
<h1>Yes</h1>
{{/if}}

Vue에서는 v-if 디렉티브를 사용하여 같은 결과를 얻을 수 있습니다.

HTML 부분
<h1 v-if="ok">Yes</h1>

v-else와 함께 "else 블록"을 추가하는 것도 가능합니다.

댓글 작성

댓글을 작성하시려면 로그인이 필요합니다.

로그인하기

게시판 목록

퍼블리셔팁

퍼블리싱과 관련된 유용한 정보를 공유하세요.
질문은 상단의 QA에서 해주시기 바랍니다.

글쓰기

번호	분류	제목	글쓴이	날짜	조회
1277	기타	이미지 최적화 (WebP/AVIF & Lazy Loading)	선택과집중 프로필 보기 이 회원 글보기 이 회원의 댓글보기	1개월 전	139
1276	CSS	고급 레이아웃(Grid + Flex 혼합 활용)	선택과집중 프로필 보기 이 회원 글보기 이 회원의 댓글보기	2개월 전	259
1275	CSS	CSS 애니메이션 고급 활용	선택과집중 프로필 보기 이 회원 글보기 이 회원의 댓글보기	2개월 전	259
1274	CSS	픽셀 단위 고정 대신 유연한 단위를 쓰자 [1]	선택과집중 프로필 보기 이 회원 글보기 이 회원의 댓글보기	3개월 전	448
1273	기타	트러블슈팅 & 품질 관리 중심	선택과집중 프로필 보기 이 회원 글보기 이 회원의 댓글보기	3개월 전	390
1272	CSS	SVG를 마치 CSS처럼 활용하기	선택과집중 프로필 보기 이 회원 글보기 이 회원의 댓글보기	4개월 전	521
1271	CSS	웹폰트 로딩 최적화 [3]	선택과집중 프로필 보기 이 회원 글보기 이 회원의 댓글보기	4개월 전	567
1270	CSS	다크 모드(Dark Mode) 지원을 위한 CSS 전략 [1]	선택과집중 프로필 보기 이 회원 글보기 이 회원의 댓글보기	5개월 전	447
1269	CSS	CSS revert 키워드로 손쉽게 스타일 초기화하기 [1]	선택과집중 프로필 보기 이 회원 글보기 이 회원의 댓글보기	5개월 전	528
1268	CSS	알러트 모양( 삼각 판넬 안에 느낌표 ) css와 dom으로 만들기	예뜨락 프로필 보기 이 회원 글보기 이 회원의 댓글보기	5개월 전	419
1267		이미지 갤러리 (직)제작 소스	잠실삼촌 프로필 보기 이 회원 글보기 이 회원의 댓글보기	9개월 전	699
1266	HTML	bootstrap4 grid-item 책갈피 표시	하얀감자 프로필 보기 이 회원 글보기 이 회원의 댓글보기	9개월 전	829
1265	CSS	clamp를 사용하는 경우에 대해서 여쭈어 봅니다. [2]	7reemoon 프로필 보기 이 회원 글보기 이 회원의 댓글보기	1년 전	755
1264		파일 입력필드 숨기고 아이콘(폰트어썸)으로 대체	Tak2 프로필 보기 이 회원 글보기 이 회원의 댓글보기	1년 전	1247
1263	HTML	textContent는 MOZ의 MDN에서 XSS해킹이 않된다 그러나 다중은 않되요 그러나 해결과 해결할 일	piadream 프로필 보기 이 회원 글보기 이 회원의 댓글보기	1년 전	782
1262	CSS	Div 를 프레임으로 잡기 tested by w3schools.com	piadream 프로필 보기 이 회원 글보기 이 회원의 댓글보기	1년 전	985
1261	CSS	기본적인 CSS 사용 태그 [ Site on Base Default - Custom Free ]	piadream 프로필 보기 이 회원 글보기 이 회원의 댓글보기	1년 전	997
1260	HTML	마우스 클릭시 효과음 나오고 마우스에 서클 퍼지는 효과 재미 있네요..	설국열차 프로필 보기 이 회원 글보기 이 회원의 댓글보기	2년 전	1480
1259	기타	나리야빌더 사용중 페이징중에 바로 이전이나 다음 페이지가 동작이 안되는증상 해결	정후이 프로필 보기 이 회원 글보기 이 회원의 댓글보기	2년 전	820
1258	CSS	스와이퍼 페이징 커스텀 방법 어떻게 하나요...?? [3]	김성래yo 프로필 보기 이 회원 글보기 이 회원의 댓글보기	2년 전	1573
1257	HTML	input의 팁	piadream 프로필 보기 이 회원 글보기 이 회원의 댓글보기	2년 전	1361
1256	CSS	css 애니메이션 눈 떨어지는 레이아웃(스킨인데 못올리게 해서 여기에다...)	돈도없어개발하기도시러 프로필 보기 이 회원 글보기 이 회원의 댓글보기	2년 전	1262
1255		상업이용 가능한 디자인소스(html, css) 완성 코딩 소스입니다. [16]	샤이닝 프로필 보기 이 회원 글보기 이 회원의 댓글보기	2년 전	3600
1254		<div>을 iframe처럼 만들기 [5]	천사의눈 프로필 보기 이 회원 글보기 이 회원의 댓글보기	2년 전	4787
1253		radio 버튼 클릭하면 input text 값 넘겨주기 [6]	취뉴비 프로필 보기 이 회원 글보기 이 회원의 댓글보기	2년 전	1543
1252	레이아웃	아무데서나 쓸수 있는 팝업창 기능 만들어보았습니다. [7]	swallow 프로필 보기 이 회원 글보기 이 회원의 댓글보기	2년 전	1773
1251	웹접근성	미니 웹 음악 플레이어 LP player Music (LPM) [12]	두리삼촌v 프로필 보기 이 회원 글보기 이 회원의 댓글보기	2년 전	2042
1250	레이아웃	이전자료 DLplayer Audio 버전입니다. [19]	두리삼촌v 프로필 보기 이 회원 글보기 이 회원의 댓글보기	2년 전	1681
1249	레이아웃	웹음악플레이어 (html5 및 자바스크립트 기반) [30]	두리삼촌v 프로필 보기 이 회원 글보기 이 회원의 댓글보기	2년 전	3204
1248	기타	(html,js,css) javascript alert메서드 자체를 변경하여, 팝업 alert 만들어보기	돈도없어개발하기도시러 프로필 보기 이 회원 글보기 이 회원의 댓글보기	2년 전	1138