Group Element
Creates a wrapper element around children and keeps the data structure flat.
#Examples
Form `data`:
<script>
export default {
mixins: [Laraform],
data: () => ({
schema: {
name: {
type: 'group',
label: 'Name',
schema: {
firstname: {
type: 'text',
placeholder: 'First name',
floating: 'First name',
columns: 6
},
lastname: {
type: 'text',
placeholder: 'Last name',
floating: 'Last name',
columns: 6
},
}
}
}
})
}
</script>
Form `data`:
<script>
export default {
mixins: [Laraform],
data: () => ({
schema: {
personal: {
type: 'group',
label: 'Personal Information',
schema: {
name: {
type: 'group',
schema: {
firstname: {
type: 'text',
placeholder: 'First name',
floating: 'First name',
columns: 6
},
lastname: {
type: 'text',
placeholder: 'Last name',
floating: 'Last name',
columns: 6
}
}
},
profession: {
type: 'text',
placeholder: 'Profession',
floating: 'Profession'
}
}
},
contact: {
type: 'group',
label: 'Contact Information',
schema: {
contacts: {
type: 'group',
schema: {
email: {
type: 'text',
placeholder: 'Email',
floating: 'Email',
columns: 6
},
phone: {
type: 'text',
placeholder: 'Phone',
floating: 'Phone',
columns: 6
}
}
},
address: {
type: 'text',
placeholder: 'Address',
floating: 'Address'
}
}
}
}
})
}
</script>
#Options
| Name | Type | Description |
|---|---|---|
| schema | object |
Schema of a child elements. |
#Properties
| Name | Type | Default | Description |
|---|---|---|---|
| children$ | object |
{} |
Child components. |
#Methods
# .reset()
Resets the element to it's default state.
#Slots
# children
Props
el$object : The element component.
Contains the children of the element.