[Vue] 동적인 웹 앱을 구현할 때 자주 사용하는 디렉티브

• v-if : 지정한 뷰 데이터 값의 참, 거짓 여부에 따라 해당 HTML 태그를 화면에 표시하거나 표시하지 않는다.
  🚨 해당 태그를 완전히 삭제
• v-for : 지정한 뷰 데이터의 개수만큼 해당 HTML 태그를 반복 출력한다.
• v-show : v-if와 유사하게 데이터의 진위 여부에 따라 해당 HTML 태그를 화면에 표시하거나 표시하지 않는다.
  🚨 css style 효과만  display:none; 으로 주어
  실제 태그는 남아 있고 화면 상으로만 보이지 않는다.
  ex)  <div id="quest_q" v-show="countDownTimer > 0"> 
  🧐 코드 해석 : countDownTimer가 0 이상일때만 보여준다.
  이런식으로 v-show에 조건을 주면 됨!!
• v-on : 화면 요소의 이벤트를 감지하여 처리할 때 사용한다.
  ex) v-on:click은 해당 태그의 클릭 이벤트를 감지하여 특정 메서드를 실행할 수 있다.
• v-model : 폼(form)에서 주로 사용되는 속성이다. 폼에 입력한 값을 뷰 인스턴스의 데이터와 즉시 동기화한다.
  화면에 입력된 값을 저장하여 서버에 보내거나 watch와 같은 고급 속성을 이용하여 추가 로직을 수행할 수 있다.
  <input>, <select>, <textarea> 태그에만 사용할 수 있다.