Поля формы Persist Dynami c в компоненте Ant Design Step - PullRequest
Новая
       7

Поля формы Persist Dynami c в компоненте Ant Design Step

0 голосов
/ 12 марта 2020

У меня есть многошаговая форма, использующая компонент ant design step для достижения этой цели. На одном из шагов у меня есть реализация динамического добавления поля ввода c, где я нажимаю знак «плюс», чтобы добавить новое поле. После завершения, и я перехожу к следующему шагу и возвращаюсь к шагу, присутствует только одно поле, и когда я снова нажимаю на знак «плюс», чтобы добавить поля, как и раньше, он добавляет поля, но в них уже есть данные, введенные ранее. .

Как мне сохранить, чтобы, если я оставлю этот шаг и вернусь, количество полей, которые я оставлю, будет таким же, какое я встречаю, когда вернусь? 

const { field, dynamicFields } = inputs; //coming from props

const [blankField, setBlankField] = useState([dynamicFields]);

const addField = () => {
  setBlankField([...blankField, [...dynamicFields]]);
};

{
  blankField.map((items, legId) => (
    <>
      {legId !== 0 ? (
        <Divider orientation="left">{`${LEG}${legId}`}</Divider>
      ) : (
        false
      )}
      {items.map(item => {
        const { placeholder, key, label, inputType, rules, options } = item;
        const totalOptions = { preserve: true, rules, ...options };

        return (
          <Form.Item {...DYNAMIC_FORM_ITEM_LAYOUT} key={legId} label={label}>
            {getFieldDecorator(
              `${field}[${legId}].${key}`,
              totalOptions
            )(
              <Select
                allowClear
                showSearch
                onSearch={onSearch}
                placeholder={intl.formatMessage(placeholder)}
                loading={isLoading}
              >
                {predictions
                  ? predictions.map(({ description, id }) => (
                      <Option key={id} value={description}>
                        {description}
                      </Option>
                    ))
                  : false}
              </Select>
            )}
          </Form.Item>
        );
      })}
    </>
  ));
}

I ' Я хотел бы добавить, что, когда шаг завершен, и я отправляю, все значения из всех полей сохраняются соответствующим образом. Мне нужно только сохранить поля с их значениями без изменений, поэтому, когда я перехожу к следующему шагу и возвращаюсь, я вижу это так, как я его оставил.

Ссылка на видео, чтобы помочь понять мои проблема - видео

...