[Vuejs]-How to detect changes made in the edited field in Vue?

0๐Ÿ‘

I think this works:

watch: {
    'users.email': function(newEmail, oldEmail) {
        //
    }
}

0๐Ÿ‘

I think something like this might work?

data: function() {
  return {
    user: { 
      email: '',
      password: ''
    },
    editedFields: []
  }
},
watch: {
  users: {
    handler: function(val, oldVal) {
      for (var key in val) {
        if(val[key] != oldVal[key]) {
          this.data.editedFields.push(key);
        }
      }
    },
    deep: true
  }
}

But actually, there better way of handling this would be to create a new Vue component for each field. You can then test to see if its been updated in each component.

Leave a comment