vue-form-state-manager

Simple form state manager as directive.

Usage no npm install needed!

<script type="module">
  import vueFormStateManager from 'https://cdn.skypack.dev/vue-form-state-manager';
</script>

README

vue-form-state-manager

A simple form state manager that can be used as directive.

usage

To register:

import FormState from "vue-form-state-manager";
Vue.directive('form-control', FormState);

Use:

<input ... form-control="'field_name'" />

Checking the form state:

import { formState, formIsDirty, formIsPristine } from "vue-form-state-manager";

formState(formId) == { dirty: Boolean, pristine: Boolean };
formState(formId).dirty == formIsDirty(formId);
formState(formId).pristine == formIsPristine(formId);

Reseting a single input:

export default {
  name: "MyComp",
  ...
  methods: {
    myMethod() {
      this.prop = NEW_VALUE;
      resetInitialValueFor("test-form", "field-name", this.prop);
    }
  },
  ...
}

roadmap

  • API to control the state programmatically.

licence

MIT