[Vuejs]-How to send a axios http put request only if there is a change on the object in Vue JS?

2๐Ÿ‘

โœ…

You can always use a watcher, example:

new Vue({
  el: '#app',
  data: {
    message: 'Hello Vue.js!',
    foo: {
      bar: {
        baz: 'foo bar baz'
      }
    }
  },
  watch: {
    message(newValue, oldValue) {
      if (newValue != oldValue) alert('change 1')
    },
    'foo.bar.baz'(newValue, oldValue) {
      if (newValue != oldValue) alert('change 2')
    }
  }
})
<script src="https://unpkg.com/vue"></script>

<div id="app">
  <p>{{ message }}</p>

  <input v-model="message">
  <input v-model="foo.bar.baz">

</div>
๐Ÿ‘คVucko

1๐Ÿ‘

You could watch deeply your property as follows :

watch: {
    person: {
        handler: (newValue,oldValue) {

        },
        deep: true
    }
}

Leave a comment