[Vue.js] 조건부 렌더링 본문 요약

조건부 렌더링 1. v-if # Handlebars와 같은 문자열 템플릿에서는 다음과 같은 조건부 블록을 작성할 수 있습니다. {{#if ok}} <h1>Yes</h1> {{/if}} # Vue에서는 v-if 디렉티브를 사용하여 같은 결과를 얻을 수 있습니다. <h1 v-if="ok">Yes</h1> # v-else와 함께 else 블록을 추가하는 것도 가능합니다. <h1 v-if="ok">Yes</h1> <h1 v-else>No</h1> 2. <template>에 v-if을 갖는 조건부 그룹 만들기 # v-if는 디렉티브기 때문에 하나의 엘리먼트에 추가해야합니다. 하지만 하나 이상의 엘리먼트를 트랜지션하려면 어떻게 해야할까요? 이 경우 우리는 보이지 않는 래퍼 역할을 하는 <template> 엘리먼트에 v-if를 사용할 수 있습니다. 최종 렌더링 결과에는 <template> 엘리먼트가 포함되지 않습니다. <template v-if="ok"> <h1>Title</h1> <p>Para...

원문링크 : [Vue.js] 조건부 렌더링 본문 요약