Пользовательский onChange в renderSelectField - не работает избыточная форма - PullRequest
0 голосов
/ 09 октября 2018

У меня есть renderSelectField как

const renderSelectField = ({ input, label, meta: { touched, error }, children, ...custom }) => (
  <SelectField
    errorText={touched && error}
    {...input}
    onBlur={(event, index, value) => input.onBlur(value)}
    onChange={(event, index, value) => {
      input.onChange(value);
    }}
    children={children}
    {...custom}
  />
 );

и a from с двумя выбранными полями. Я хочу вызвать какое-то действие, когда оба поля выбраны, здесь у нас есть getMappedRooms ().Но когда я выбираю одно поле (roomType), а затем другое поле (floorNumber), значение в более раннем поле исчезает.

Как мне справиться с такой ситуацией?

         <form>
            <Field
              name="roomType"
              component={renderSelectField}
              hintText="Select Room Type"
              fullWidth
              onChange={(event, index) => {
                getMappedRooms('e', index, floorNumberValue);
              }}
            >
              {
                roomTypes.map((roomType, i) => (
                  <MenuItem key={i} value={roomType} primaryText={`Room Type : ${roomType.roomType || roomTypeValue.roomType}`} />
                ))
              }
            </Field>
            <Field
              name="floorNumber"
              component={renderSelectField}
              onChange={(event, index) => {
                getMappedRooms('e', roomTypeValue, index);
              }}
            >
              {
                [...Array(numberOfFloors).keys()].map((floorNumber, i) => (
                  <MenuItem key={i} value={floorNumber + 1} primaryText={`Floor No : ${floorNumber + 1}`} />
              ))
              }
            </Field>
          </form>
...