опции не отображаются при реакции выбора - PullRequest
Новая
       6

опции не отображаются при реакции выбора

0 голосов
/ 24 февраля 2020

Я использую react-select для поля выбора. Когда я использую обычную функцию map, отображаются параметры, но если я использую вложенную функцию map, она не перечисляет параметры.

Вот что я сделал 

<Field
  name="subjects"
  label="Destination Subjects *"
  component={SelectField}
  isSearchable
  isMulti
  options={get(props, "destinations").map(destination => {
    return preferredDestination.map(pdes => {
      if (destination._id === pdes.name) {
        if (get(destination, "subjects").length > 0) {
          return get(destination, "subjects").map(
            (subject, idx) => {
              console.log("subject", subject); // it gets printed too
              return {
                name: subject.id,
                value: subject.val
              };
            }
          );
        } else {
          return [];
        }
      } else {
        return [];
      }
    });
  })}
/>

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

<Field
  name="subjects"
  label="Destination Subjects *"
  component={SelectField}
  isSearchable
  isMulti
  options={get(props, "destinations").map(destination => {
    return {
      name: destination.name,
      value: destination.value,
    }
  })}
/>

По обычному map Функция, которую я должен был сказать выше код. Это работает, но это не то, что я хочу. Я хочу, чтобы эти пункты были опцией, которая соответствует теме для определенного выбранного пункта назначения, а не объектам всех пунктов назначения.

Как теперь я могу отобразить параметры, основанные на условиях, описанных выше?

При отладке я получаю следующие параметры

enter image description here

Вот скриншот того, что я получаю с помощью решения Виджая

enter image description here

1 Ответ

1 голос
/ 24 февраля 2020

Просто убедитесь, что полученный массив является одномерным и используйте label для имени и value для значения

Вот код 

<Field
  name="subjects"
  label="Destination Subjects *"
  component={SelectField}
  isSearchable
  isMulti
  options={get(props, "destinations").map(destination => {
    // Don't use second map here 
    // if you're just trying to find the matching element
    // in the second array

    if (
       preferredDestination.findIndex(
        pdes => destination._id === pdes.name
       ) >= 0
    ) {
      if (get(destination, "subjects").length > 0) {
          return get(destination, "subjects").map(
            (subject) => {
              return {
                label: subject.id, // change it to label
                value: subject.val
              };
            }
          );
      }
    }
    // remove unwanted else block
    return null
    })
    .filter(x => x !== null) // remove null elements
    .reduce((a, c) => [...a, ...c], []) // this will convert the 2D array to 1D 
  }
/>
...