Vue 책을 공부하면서 했던 내용입니다.
<div id="exam">
<input type="text" v-model="amount">
<p><button @click="inner">예금</button></p> //v-on:click 을 @click으로 줄임
<p><button @click="outter">인출</button></p>
<h3>잔고 : </h3>
</div>
var vm = new Vue({ //인스턴스 생성
el : "#exam",
data : {
amount : 0, // v-model = amount
money : 0 //
},
methods : {
inner : function(e){ //예금버튼 클릭
var amt = Number(this.amount);
if(amt <= 0){
alert('0보다 작은 금액은 예금안됨')
}else{
this.money += amt;
}
},
outter : function(e){ // 출금버튼 클릭
var amt = Number(this.amount);
if(amt <= 0){
alert('0보다 작은금액 인출안됨');
}else if(amt > this.money){
alert('잔고보다 큰 금액 ㄴ');
}else{
this.money -= amt;
}
}
}
})