React Tcomb表单不能从工厂获取DateInput的值

时间:2018-04-16 09:59:36

标签: reactjs tcomb

我有tcomb-form的问题。 在我的tcomb-form中,我声明了一个具有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>

0 个答案:

没有答案
相关问题