Skip to content

Commit baa2445

Browse files
committed
docs(readme): add custom fields example
1 parent 5932805 commit baa2445

File tree

1 file changed

+13
-13
lines changed

1 file changed

+13
-13
lines changed

README.md

Lines changed: 13 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -12,24 +12,24 @@
1212
All fields are required and input text by default.
1313
Once submitted, an event 'formSubmitted' is emitted on $root with the formName and all values.
1414

15-
## Key Features
16-
- [x] Generate a form from json / array (formFields props)
17-
- [x] Bulma classes by default (that can be overwritten)
18-
- [x] Responsive
19-
- [x] Fields on multiples columns
15+
## Features
16+
* **Generate a form** from an array (formFields prop)
17+
* **Bulma classes** by default (that can be overwritten)
18+
* **Responsive**
19+
* Fields on **multiples columns**
2020
```js
2121
const formFields = [ [{ label: 'label one' }, { label: 'label two' }] ]
2222
```
23-
- [x] Pre filled values
23+
* **Pre filled values**
2424
```js
2525
const formFields = [{ label: 'the label', value: 'the value' }]
2626
```
27-
- [x] [Simple rules validation](https://logaretm.github.io/vee-validate/guide/rules.html#rules)
27+
* [**Simple rules validation**](https://logaretm.github.io/vee-validate/guide/rules.html#rules)
2828
```js
2929
const formFields = [{ label: 'the label', rules: { is_not: 'label' } }]
3030
```
31-
- [x] Cross field validation (see password confirmation example in the CodeSandbox link)
32-
- [x] Custom attr (class, data-*, ...) on .field & real fields (input, textarea...)
31+
* **Cross field validation** (see password confirmation example in the CodeSandbox link)
32+
* **Custom attr** (class, data-*, ...) on .field & real fields (input, textarea...)
3333
```js
3434
const formFields = [{
3535
attr: { class: 'classOnInput' },
@@ -38,23 +38,23 @@ Once submitted, an event 'formSubmitted' is emitted on $root with the formName a
3838
label: 'the label'
3939
}]
4040
```
41-
- [x] Scoped slot everywhere inside the form
41+
* **Scoped slot support** everywhere inside the form
4242
```js
4343
const formFields = [{ slot: 'nameOfTheSlot', props: { foo: 'bar' } }]
4444
```
45-
- [x] Custom fields support inside scoped slot
45+
* [**Custom fields support**](https://codesandbox.io/s/vue-form-json-demo-dgk2n?file=/src/App.vue) inside scoped slot
4646
```html
4747
<template #nameOfTheSlot="{ foo, updateFormValues, isFormReseted }">
4848
```
49-
- [x] Html support
49+
* **Html support**
5050
```js
5151
const formFields = [{ html: '<p>Your html content</p>' }]
5252
```
5353

5454
## Install
5555
```sh
5656
yarn add vue-form-json
57-
# Optional: bulma @fortawesome/fontawesome-free (fontawesome is not needed if hasIcon props is false)
57+
# Optional: bulma @fortawesome/fontawesome-free (fontawesome is not needed if hasIcon prop is false)
5858
```
5959

6060
## Usage

0 commit comments

Comments
 (0)