vue.js入門_12_監視プロパティ(基本)

by s9iwork

HTML

<div id="app">
  <p>{{ message }}</p>
  <p>
    <input type="text" v-model:value="message">
  </p>
  <pre>{{ $data }}</pre>
</div>

<script src="https://cdn.jsdelivr.net/npm/vue@2.5.22/dist/vue.js"></script>

JavaScript

new Vue({
  el: '#app',
  data: {
    message: 'Hello Vue.js'
  },
  watch: {
    message: function(newValue, oldValue) {
      console.log('new: %s, old: %s', newValue, oldValue)
    }
  }
})