vue.js 조건부 렌더링

· 2019-01-28 (월) 21:41:30 · 2652

조건부 렌더링

v-if

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

HTML부분
<!-- Handlebars 템플릿 -->
{{#if ok}}
    <h1>Yes</h1>
{{/if}}

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

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

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

<h1 v-if="ok">Yes</h1>
<h1 v-else>No</h1>

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

퍼블리셔팁

1,282건

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

+
분류 제목 글쓴이 날짜 조회
기타 19-02-04 조회 4,407
기타 19-02-04 조회 6,729
기타 19-01-31 조회 2,952
기타 19-01-31 조회 2,873
기타 19-01-31 조회 2,365
기타 19-01-28 조회 2,813
기타 19-01-28 조회 2,620
기타 19-01-28 조회 2,653
기타 19-01-24 조회 2,634
기타 19-01-24 조회 2,381
기타 19-01-24 조회 2,724
기타 19-01-23 조회 2,270
기타 19-01-23 조회 2,445
기타 19-01-23 조회 2,618
기타 19-01-22 조회 2,713
기타 19-01-22 조회 2,203
기타 19-01-22 조회 2,088
기타 19-01-21 조회 2,566
기타 19-01-16 조회 2,160
기타 19-01-16 조회 1,913
기타 19-01-16 조회 2,115
기타 19-01-12 조회 1,808
기타 19-01-12 조회 2,016
기타 19-01-12 조회 1,731
기타 19-01-11 조회 1,853
기타 19-01-11 조회 1,774
기타 19-01-11 조회 2,067
기타 19-01-10 조회 1,793
기타 19-01-10 조회 2,127
기타 19-01-10 조회 2,117