Path is a string value that is used to access any value on the formData using lodash get method.
This table shows how to use path and listPath keys for the following code.
Path Type | Usage Example |
Update value of first level child | setPathValue('child1', newValue) |
Update value of second level child | setPathValue('child3.subchild1', newValue) |
Update value of list's element at 0th index | setPathValue('listChild[0]', newValue) |
Update value of list of object's element at 0th index with key subkey1 | setPathValue('listChild[0].subkey1', newValue) |
Get value of first level child | getValue('child1') |
Get value of second level child | getValue('child3.subchild1') |
Get value of list's element at 0th index | getValue('listChild[0]') |
Get value of list of object's element at 0th index with key subkey1 | getValue('listChild[0].subkey1') |
Get error of first level child | getError('child1') |
Get error of second level child | getError('child3.subchild1') |
Get error of list's element at 0th index | getError('listChild{0}') |
Get error of list of object's element at 0th index with key subkey1 | getError('listChild{0}.subkey1') |
Unset value and key of first level child | unsetPathValue('child1') |
Unset value and key of second level child | unsetPathValue('child3.subchild1') |
Unset value and key of list's element at 0th index | unsetPathValue('listChild[0]') |
Unset value and key of list of object's element at 0th index with key subkey1 | unsetPathValue('listChild[0].subkey1') |
////////////-- example rules --///////////
const rules = [
{ path: 'child1', ruleSet: ['required'] },
{ path: 'child2', ruleSet: ['required'] },
{ path: 'child3.subchild1', ruleSet: ['required'] },
{ path: 'child3.subchild2', ruleSet: ['required'] },
{
listPath: 'listChild',
subRules: [
{path: 'subkey1', ruleSet: ['required', { rule: 'length', greaterThan: 3 }]},
{path: 'subkey2', ruleSet: [{rule: 'required', }, { rule: 'number', greaterThan: 5 }]}
]
},
{path: 'listChild', ruleSet: [{ rule: 'required'}, { rule: 'listSize', greaterThan: 2 }]}
];
////////////-- example formData --///////////
const formData = {
child1: "child1 value",
child2: "child2 value",
child3: {
subchild1: "child3 subchild1 value",
subchild2: "child3 subchild2 value",
},
listChild: [
{
subkey1: "list 0th element subkey1 value",
subkey2: "list 0th element subkey2 value",
},
{
subkey1: "list 1st element subkey1 value",
subkey2: "list 1st element subkey2 value",
}
]
};
////////////-- example validationError result object --///////////
const validationError = {
"child1": "This field is required", // first level child
"child2": "This field is required", // first level child
"child3.subchild1": "This field is required", // second level child
"child3.subchild2": "This field is required", // second level child
"listChild": "This field is required", // first level list child
"listChild{0}.subkey1": "This field is required", // list of object's child
"listChild{0}.subkey2": "This field is required", // list of object's child
"listChild{1}.subkey1": "This field is required", // list of object's child
"listChild{1}.subkey2": "This field is required", // list of object's child
}