Вставка пустого поля опции вверху динамически созданного поля выбора

Question

Я использую Выберите поле из antd .В следующем фрагменте я динамически создаю Option в поле выбора и возвращаюсь, чтобы стать частью массива с именем analyticalMethodtOptions.

let analyticalMethodtOptions =
  analyticalMethods &&
  analyticalMethods.map((aM, i) => (
    <Option key={i} value={aM.id}>
      {aM.name}
    </Option>
  ));

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

Я хочу вставить пустую панель параметров, например:

<Option value=""></Option>

в верхней части analyticalMethodtOptions, чтобы пустой элемент был доступен в верхней части поля выбора.

Я использую его позже, чтобы отобразить поле выбора как:

  <Select
            placeholder="Select the Analytical Method"
            showSearch={true}
            filterOption={selectSearchFilter}
            defaultValue=""
          >
            {analyticalMethodtOptions}
   </Select>

Answer 1

Объявите массив и нажмите одну запись с пустым значением.

var selectOptions = [];selectOptions.push ({id: 'default', name: ''});

И скопируйте записи analicMethodtOptions в объявленный выше массив "selectOptions"

selectOptions = selectOptions.concat(analyticalMethods);

Тогда

selectOptions = selectOptions.map((aM, i) => (
            <Option key={i} value={aM.id}>
                {aM.name}
            </Option>
        ));

Затем в рендере

<Select>
    {selectOptions}
</Select>