Несколько полей ввода для одного поля формы, используя rc-форму - PullRequest
0 голосов
/ 26 ноября 2018

Я хочу разделить поле формы на два поля ввода для пользовательского интерфейса формы, используя форму Ant Design, которая, как я понимаю, построена из rc-формы (http://react -component.github.io / form /)

Например, я хочу разделить префикс и номер телефона.Целое число сохраняется как объект:

{ prefix: 44, number: 800800 }

Я пробовал это:

Функция для объединения префикса и числа

onTelephoneChanged = (field, identifier, value) => {
    field[identifier] = value;
    return field;
}

Элемент формы

<FormItem {...formItemLayout} label={label} key={key}>
              {getFieldDecorator(key, {
                getValueFromEvent: this.onTelephoneChanged
              })(
                <div className="grouped-form-fields">
                  <div className="form-field-labeled">
                    <div className="form-field-label">X:</div>
                    <div className="form-field-control">
                      <InputNumber onChange={this.onTelephoneChanged.bind(this, field.value, 'prefix')} defaultValue={field.value.prefix} />
                    </div>
                  </div>
                  <div className="form-field-labeled">
                    <div className="form-field-label">Y:</div>
                    <div className="form-field-control">
                      <InputNumber onChange={this.onTelephoneChanged.bind(this, field.value, 'number')} defaultValue={field.value.number} />
                    </div>
                  </div>
                </div>
              )}
            </FormItem>

Но это не работает, onFieldsChange формы не вызывается.Любые примеры того, как этого добиться, будут высоко оценены!

...