vue.js 조건부 렌더링 v-if
조건부 렌더링
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>
JS부분
data:{
ok: true
}
|
댓글을 작성하시려면 로그인이 필요합니다.