mirror of
https://github.com/discourse/discourse.git
synced 2024-12-25 06:43:58 +08:00
f6a4de4805
Collections were an existing concept in FormKit but didn't allow nesting. You can now do infinite nesting:
```gjs
<Form
@data={{hash
foo=(array
(hash bar=(array (hash baz=1))) (hash bar=(array (hash baz=2)))
)
}}
as |form|
>
<form.Collection @name="foo" as |parent parentIndex|>
<parent.Collection @name="bar" as |child childIndex|>
<child.Field @name="baz" @title="Baz" as |field|>
<field.Input />
</child.Field>
</parent.Collection>
</form.Collection>
</Form>
```
On top of this a new component has been added: `Object`. It allows you to represent objects in your form data. Collections are basically handling arrays, and Objects are objects.
This is useful if you form data has this shape for example:
```javascript
{ foo: { bar: 1, baz: 2 } }
```
This can now be mapped in your form using this syntax:
```gjs
<Form @data={{hash foo=(hash bar=1 baz=2)}} as |form|>
<form.Object @name="foo" as |object name|>
<object.Field @name={{name}} @title={{name}} as |field|>
<field.Input />
</object.Field>
</form.Object>
</Form>
```
Objects accept nested collections and nested objects. Just like Collections.
A small addition has also been made to `Collection`, they now support a custom `@tagName`, it's useful if each item of your collection is the row of a table for example.
|
||
|---|---|---|
| .. | ||
| admin | ||
| base | ||
| components | ||
| float-kit | ||
| form-kit | ||
| foundation | ||
| login | ||
| modal | ||
| select-kit | ||
| table-builder | ||
| d-editor.scss | ||
| font-variables.scss | ||
| input_tip.scss | ||
| loading-slider.scss | ||
| post-action-feedback.scss | ||
| printer-friendly.scss | ||
| software-update-prompt.scss | ||
| topic-entrance.scss | ||
| topic-timeline.scss | ||
| whcm.scss | ||