Выберите Взаимодействовать с компонентом - PullRequest
Новая
       40

Выберите Взаимодействовать с компонентом

0 голосов
/ 03 июля 2018

У меня проблема с этим кодом: 

const ListItem = ({data: {loading, error, items}}) => {
  if (loading) {
    return <p>Loading ...</p>;
  }
  if (error) {
    return <p>{error.message}</p>;
  }

  console.log(items)

  return (
    <select>
      <option key='0' value='0' disabled defaultValue>Seleccione un Item</option>
      {items.map(item => <option key={item.id} value={item.id}>{item.item}</option>)}
    </select>
  );
}

const QUERY_ITEMS = gql`
  query{
    items{
      id
      item
    }
  }
`
const ItemsListWithData = graphql(QUERY_ITEMS)(ListItem);

Является простым компонентом Select, заполняется по запросу, но не отображается в индексе. Если я поставлю ul на select, то это нормально, но с select есть проблема, я понятия не имею, что происходит, я добавлю результат с кодом. Большое спасибо, и извините за мой английский!

введите описание изображения здесь

1 Ответ

0 голосов
/ 05 июля 2018

Ваша проблема в том, что <div>, который окружает ваш <select>, имеет неправильный класс.

Изменить с 

<div class="input-field col s12"> /* ...  */ </div>

К 

<div class="select-field col s12"> /* ...  */ </div>

И все будет работать как положено!

...