Vue Formulate

Vue Formulate is the easiest way to build forms using Vue. Key features include form and field validation, file uploads, form generation, single-element inputs that support labels, help text, error messages, placeholders and more, and comprehensive documentation for use within your own projects.

Vue Formulate lets you:

✓ Create any input element with a single component
✓ Use v-model binding on fields and entire forms
✓ Re-populate an entire form from a single object
✓ Generate a form using json
✓ Easily add field labels
✓ Easily add help text
✓ Easily add form validation
✓ Easily add custom validation rules
✓ Easily create custom validation messages
✓ Easily create custom inputs

v-model an entire form Well-considered file uploads
v-model an entire form well-considered file uploads

How is Vue Formulate used?

The syntax is what developers would expect. To create an input you use the FormulateInput element and provide it with a few props:

<FormulateInput
  v-model="value"
  type="email"
  name="email"
  label="What is your email address"
  help="Where should we contact you?"
  validation="required|email"
/>

Collecting multiple FormulateInput elements within a single FormulateForm element (even deeply nested) allows you to v-model your entire form.

GitHub