I have the following Simple Schema defined:
import SimpleSchema from 'simpl-schema';
export const Comments = new Mongo.Collection("comments");
export const CommentsSchema = new SimpleSchema({
comments: Array,
"comments.$": Object,
"comments.$.author": String
"comments.$.text": String
})
And I have a component with AutoForm
to view/edit this comments array:
import {ErrorsField, SubmitField, ListField} from "uniforms-semantic";
import AutoForm from 'uniforms-semantic/AutoForm';
<AutoForm schema={CommentsSchema} onSubmit={comments => this.updateRequest(comments)} model={this.props.comments}>
<ListField name={"comments"}/>
<ErrorsField/>
<SubmitField/>
</AutoForm>
this.updateRequest(...)
is a function that calls Meteor backend function that updates Mongo collection.
I would like to customize ListField
so that for each comment the "comments.$.text"
TextField is displayed as a bigger text box with newlines allowed.
It's currently just a single line string:
I considered rewriting a custom version of ListField
but that seemed unnecessarily complicated for a small change like that. What is the best way to do add small customization like this using uniforms API?
Looking at the docs, it appears you can specify the inner workings of ListField. This is untested, but I would guess something along these lines:
<ListField name="comments">
<ListItemField name="$">
<NestField name="">
<TextField name="author" />
<LongTextField name="text" />
</NestField>
</ListItemField>
</ListField>
https://github.com/vazco/uniforms/blob/master/INTRODUCTION.md#props-propagation