Форма React Tcomb не может получить значение DateInput с завода
У меня проблема с tcomb-формой. Внутри моей tcomb-формы я объявил фабрику с компонентом DateInput (@blueprintjs/datetime).
Но когда я получаю значения формы. Это поле ввода не определено. Похоже, tcomb-form не может получить значения из моего компонента DateInput.
Вот код.
this.state = {
currentDate: new Date()
};
const Type = t.struct({
invoiceDate: t.maybe(t.String),
});
const formOption = {
fields: {
invoiceDate: {
factory: l =>
this.DateInputField({ ...l, getBundleById, currentDate }),
attrs: {
className: 'pt-input',
},
error: 'error text'
}
}
};
handleDateInputChange = (date, locals) => {
this.setState({
currentDate: date
}, () => {
console.log('this.state.currentDate: ', this.state.currentDate);
locals.onChange(this.state.currentDate);
});
};
DateInputField = (locals) => {
// console.log('locals: ', locals);
return (<div>
<label className="pt-label garage-info__label" htmlFor="invoiceDate">Invoice Date: </label>
<DateInput value={locals.currentDate} onChange={date => this.handleDateInputChange(date, locals)} />
</div>);
};
My form:
<form className="col-xs-12" onSubmit={onUploadInvoice}>
{
!isSuccess &&
<TcombContainer
type={Type}
values={{
invoiceDate: currentDate
}}
options={formOption}
onChange={onChangeUploadInvoice}
/>
}
{
isError &&
<div className="pt-callout pt-intent-danger">
{ isError.message }
</div>
}
{
isRequest &&
<div className="pt-callout pt-intent-warning">
<span>{ getBundleById('CARENET.ASSIGNMENT.EDIT.UPLOAD.REQUEST') }</span>
</div>
}
{
(!isRequest && !isSuccess) &&
<div className="text-center">
<button type="submit" className="pt-button pt-large pt-intent-success">
{getBundleById('CARENET.ASSIGNMENT.EDIT.FORM.TYRES.SUBMIT_BUTTON')}
</button>
</div>
}
</form>