๋ฐ์ํ
watch๋ ๋ฐ์ดํฐ ๋ณํ๋ฅผ ๊ฐ์งํ์ฌ ์๋์ผ๋ก ํน์ ๋ก์ง์ ์ํํ๋ค.
๋ฐ์ดํฐ ํธ์ถ๊ณผ ๊ฐ์ด ์๊ฐ์ด ์๋์ ์ผ๋ก ๋ ๋ง์ด ์๋ชจ๋๋ ๋น๋๊ธฐ ์ฒ๋ฆฌ์ ์ ํฉํ๋ค.
<!DOCTYPE html>
<head>
<title>watch</title>
</head>
<body>
<div id="app">
<input v-model="message">
</div>
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<script>
new Vue({
el: '#app',
data: {
message: 'Hello Vue.js!'
},
watch: {
message: function(data) {
console.log('message์ ๊ฐ์ด ๋ฐ๋๋๋ค : ', data)
}
}
})
</script>
</body>
</html>
๋ฐ์ํ
'JavaScript > Vue' ์นดํ ๊ณ ๋ฆฌ์ ๋ค๋ฅธ ๊ธ
| [Vue.js] computed ์์ฑ๊ณผ methods ์์ฑ์ ์ฐจ์ด์ (0) | 2022.06.06 |
|---|---|
| [Vue.js] Vue Directive (0) | 2022.06.06 |
| [Vue.js] Vue์์์ ์๋ฐ์คํฌ๋ฆฝํธ ํํ์ (0) | 2022.06.06 |
| [Vue.js] v-bind (0) | 2022.06.06 |
| Named View (0) | 2022.06.06 |
๋๊ธ