dynamic-form-watch.vue

<script lang="ts">
export default Vue.extend({
  watch: {
    saas: {
      immediate: true,
      handler(value): void {
        if (value) {
          // Clear current attr values
          this.clearFormAttributes();
          // Initialize form attributes for new service, note that we must use $set to preserve Vue reactiviy on `form` object
          // (which is required for Vuelidate to work correctly)
          this.allAttributes.forEach(attr => this.$set(this.form, attr, ""));
        }
      },
    },
  },
});
</script>