IT
vue.js watch 데이터 모니터링
agnusdei1207
2023. 5. 13. 00:27
반응형
SMALL
<template>
<div>
<h1>Home {{ title1 }}</h1>
</div>
<input type="text" v-model="input1"> <!-- 양방향 입력 가능-->
<button type="button" @click="getData">get</button> <!-- onclick 과 같은 효과 (vue.js)-->
<button type="button" @click="setData">set</button>
</template>
<script>
export default{
data(){
return{
title1 : "제목1",
title2 : "제목2",
input1 : "input1",
}
},
watch : { // 모니터링
input1(){
console.log(intpu1);
}
},
method : { // 자바스크립트의 모든 함수는 이곳에 선언
getDate(){
alert(this.input1);
},
setDate(){
this.input1 = "set";
},
},
}
</script>
1. watch 모니터링 할 변수명과 동일한 메소드명으로 생성
반응형
LIST