[Vuejs]-Vue2: Reacting on non existing input elements

If the name attribute of your inputs are always going to match the data properties of your Vue component, your valid method could go through each input in the component and check if the property with the same name is valid:

valid: function() {
  let inputs = this.$el.querySelectorAll('input');
  for (let i = 0; i < inputs.length; i++) {
    if (this[inputs[i].name] == '') {
      return false;
    }
  }
  return true;
}

Here’s a working fiddle.

Can you just do a check to see if this.location2 is set?

new Vue({
  el: '#app',
  data: {
    location: '',
    location2: ''
  },
  methods: {
    valid: function() {
      if (this.location2) {
        return !(this.location != '' && this.location2 != '');
      }
      return this.location == '';
    }
  },
})

Fiddle: https://jsfiddle.net/gratiafide/g92Lscu4/1/