1. 이벤트 처리

1. 기본 구조
   1) view단
   - v-on:이벤트명 = "inline 모델데이터 처리 or 기능 메서드"
   - @:이벤트명 = "inline 모델데이터 처리 or 기능 메서드"
   ex) v-on:click ="totAll"
   2) Vue 인스턴스 객체 선언
   - 기능메서드 함수 정의
   methods:{
   함수명1:function(){처리할 내용1},
   함수명2:function(){처리할 내용2}
   }

## inline 모델 데이터 처리
var vm = new Vue({
			el:".container",
			data:{msg:"이벤트 처리",amount:0,balance:0, }
		});	
  <h3>누적 합산액 : {{balance}}</h3>
 
  <form id="frm01" class="form"  method="post">
  <nav class="navbar navbar-expand-sm bg-dark navbar-dark">
	    <input v-model="amount" class="form-control mr-sm-2" placeholder="금액을 입력하세요" />
	    <button v-on:click="balance+=parseInt(amount)" class="btn btn-info" type="button">누적 합산 확인</button>
 	</nav>
	</form>  

## 기능메서드 처리
var vm = new Vue({
			el:".container",
			data:{msg:"이벤트 처리(함수호출)",amount:0,balance:0},
    methods:{
				deposit:function(){
					// this : 전체 Vue()객체를 지징하여 모델데이터나 기타 소속되어 있는 기능메서드 포함
					// alert("함수호출:"+this.amount)
					this.balance += parseInt(this.amount)
				}
              }
              
 <h4>{{balance}}</h4>
 <form id="frm01" class="form-inline"  method="post">
  	<nav class="navbar navbar-expand-sm bg-dark navbar-dark">
	    <input v-model="amount" class="form-control mr-sm-2" placeholder="숫자 입력" />
	    <button @click="deposit" class="btn btn-info" type="button">누적합산</button>
 	</nav>
	</form>