보통 css 그룹핑은 div로 하긴 하는데,
vue의 같이 처리하고 싶은거
<template>
<button @click="change()">click me!!!</button>
<button @click="countHandler(+1)">+1</button>
<template>
<h1 :class="{active : isActive}" v-if="isShow">{{ msg }}</h1>
<tem v-else-if="count > 5">
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Tenetur delectus hic iusto, quibusdam dicta, sit doloremque accusantium eos repudiandae facere dolores tempora aliquid. Quod modi, autem pariatur ducimus tempore commodi?</p>
</tem>
<h2 v-else>
Good
</h2>
</template>
</template>
이런 식으로 뭔가 같이 처리하고 싶은거 template로 묶음.
이건 html꺼가 아니여서, html은 못 읽음.
v-if 이런 거 쓸 수 있음. 뷰 기술은 쓸 수 있음.
참고로, 전체를 감싸는 저 가장 바깥의 탬플릿은 조건문을 쓸 수 없음.
'Vue.js' 카테고리의 다른 글
이벤트 핸들러 (0) | 2023.10.10 |
---|---|
v-show (0) | 2023.10.05 |
뷰 조건문 (0) | 2023.10.05 |
변수로 스타일 바꾸기 (0) | 2023.10.05 |
클래스 바인딩, 템플릿 내의 조건문. (0) | 2023.10.04 |