1
0
mirror of synced 2024-11-24 22:36:02 +03:00

adds gifs to readme and updates some language

This commit is contained in:
Andrew Boyd 2020-03-08 10:20:02 -04:00
parent 2456aead9e
commit 0e2988444f

View File

@ -14,10 +14,16 @@
### What is Vue Formulate? ### What is Vue Formulate?
Vue Formulate is the easiest way to build forms using Vue. Key features include Vue Formulate is the easiest way to build forms using Vue. Key features include
form and field validation, file uploads, form generation and a single-element form and field validation, file uploads, form generation, single-element inputs that support labels, help text, error messages, placeholders and more, and [comprehensive documentation](https://vueformulate.com) for use within your own projects.
fields with labels, help text, error messages, placeholders and lots more.
The syntax is what developers would expect:
:-------------------------:|:-------------------------:
![uploads](https://assets.wearebraid.com/vue-formulate/formulate-uploads.gif) | ![form demo](https://assets.wearebraid.com/vue-formulate/formulate-form.gif)
### 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:
```vue ```vue
<FormulateInput <FormulateInput
@ -30,15 +36,18 @@ The syntax is what developers would expect:
/> />
``` ```
Collecting multiple `FormulateInput` elements within a single `FormulateForm` element (even deeply nested) allows you to `v-model` your entire form.
### Vue Formulate lets you:
✓ Create any input element with a single component<br> ✓ Create any input element with a single component<br>
✓ Supports Vue `v-model` [binding](https://vueformulate.com/guide/#model-binding)<br> Use `v-model` [binding](https://vueformulate.com/guide/#model-binding) on fields and entire forms<br>
✓ [Re-populate an entire form](https://vueformulate.com//guide/forms/#setting-initial-values) from a single object<br> ✓ [Re-populate an entire form](https://vueformulate.com//guide/forms/#setting-initial-values) from a single object<br>
✓ [Generate a form](https://vueformulate.com//guide/forms/#generating-forms) using json<br> ✓ [Generate a form](https://vueformulate.com//guide/forms/#generating-forms) using json<br>
✓ Easy to add field labels<br> ✓ Easily add field labels<br>
✓ Easy to add help text<br> ✓ Easily add help text<br>
✓ Easy to add [form validation](https://vueformulate.com//guide/validation)<br> ✓ Easily add [form validation](https://vueformulate.com//guide/validation)<br>
✓ Easy to add [custom validation](https://vueformulate.com//guide/validation/#custom-validation-rules) rules<br> ✓ Easily add [custom validation](https://vueformulate.com//guide/validation/#custom-validation-rules) rules<br>
✓ Easy to modify [validation messages](https://vueformulate.com//guide/validation/#customize-validation-messages)<br> ✓ Easily create custom [validation messages](https://vueformulate.com//guide/validation/#customize-validation-messages)<br>
✓ Easy to add [custom inputs](https://vueformulate.com//guide/custom-inputs) ✓ Easily create [custom inputs](https://vueformulate.com//guide/custom-inputs)
There's a lot more available to read at the [documentation website](https://vueformulate.com). There's a lot more available to read at the comprehensive [documentation website](https://vueformulate.com).