<head>
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
</head>
<div id="app">
<template v-if="number === 1">
<div>1</div>
</template>
<template v-else-if="number === 2">
<div>2</div>
</template>
<template v-else="number === 3">
<div>3</div>
</template>
<button @click="inc">클릭</button>
</div>
<script>
new Vue({
el: '#app',
data: {
number: 1
},
methods: {
inc() {
this.number++;
}
}
})
</script>
'Framework > Vue2' 카테고리의 다른 글
[ Vue2 ] 09. Vue 반복문 처리 (0) | 2024.11.08 |
---|---|
[ Vue2 ] 08. Vue 토글 처리 (0) | 2024.11.08 |
[ Vue2 ] 07. Vue 클래스 & 스타일 바인딩 (0) | 2024.11.08 |
[ Vue2 ] 06. Vue Watch 속성 (0) | 2024.11.08 |
[ Vue2 ] 05. Vue Computed 속성 (0) | 2024.11.08 |