v-if="조건식"

조건식이 참일때만 보여줌 

 v-if="이거열렸나 == true"

이렇게되어있으면 열리고

 v-if="이거열렸나 == false"

이러면 안열리게

예시)

1. Template

<!--이걸클릭하면-->
<div @click="이거열렸나 = true;">어쩌구</div>


<!--이 모달창이 열림 안에있는 button 클릭하면 닫힘 -->
<div v-if="이거열렸나 == true">
	<button @click="이거열렸나 = false">닫기</button>
</div>

어쩌구가있는 Div를 클릭하면 

"이거열렸나"가 true가 되게해서

밑에 Div의 v-if가 발동하게됌

2. Script

export default {
  name: 'App',
  data(){
    return{
      이거열렸나 : false,
    }
  },

처음 기본은 false로 해두면 기본상태는 안보이는 상태

그 외

v-if

v-else

v-else-if

<!-- vue 조건문 문법 -->
<div v-if="1 == 2">
  안녕하세요
</div>
<!-- 위에 if가 안되면 밑에 else를 실행해라 -->
<!-- <div v-else>
  안녕하세요2
</div> -->
<!-- if else를 여러개쓰고싶으면 v-else-if를 써라 위에꺼아니면 이것도 맞는지아닌지 확인하게하고싶을때-->
<div v-else-if="1 == 3">
  안녕하세요3
</div>