Vue
이벤트 처리
땀모
2019. 8. 2. 11:46
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
<div id="app">
<button v-on:click="clickBtn">클릭</button>
</div>
<script src="https://unpkg.com/vue"></script>
<script>
new Vue({
el : '#app',
methods : {
clickBtn : function(){
alert('clicked')
}
}
})
</script>
</body>
</html>
인자를 넣어서 사용할 수 있음
더하기 빼기 예제
<body>
<div id="app">
{{ year }}<br>
<button v-on:click=plus()>더하기</button>
<button v-on:click="minus()">빼기</button>
</div>
<script>
new Vue({
el: '#app',
data: {
year:2018
},
methods:{
plus(){
this.year++;
},
minus(){
this.year--;
}
}
});
</script>
</body>