Материал UI Выберите компонент с данными базы данных - PullRequest
2 голосов
/ 30 мая 2020

Я пытаюсь заполнить выбранный компонент из пользовательского интерфейса материала данными из моей базы данных. Я могу успешно показать данные в компоненте, но когда я выбираю один вариант, он ломается, и появляется следующая ошибка: «category.map не является функцией». Кто-нибудь знает, что я делаю не так? Вот код:

<FormControl className={classes.formControl}>
  <InputLabel id="demo-simple-select-label">Categorias</InputLabel>
    <Select
      labelId="demo-simple-select-filled-label"
      id="demo-simple-select-filled"
      value={categorias}
      onChange={(ev) => setCategorias(ev.target.value)}
    >
      <MenuItem value="">
        <em>None</em>
      </MenuItem>
      {categorias.map((categoria) =>
        <MenuItem value={categoria.id}>{categoria.nombre}</MenuItem>
      )}
    </Select>
</FormControl>

Вот еще код, касающийся категорий:

const [categorias, setCategorias] = useState([]);


  useEffect(() => {

      const getCategorias = async () => {
        const res = await fetch("/categories", {
            method: 'GET',
            headers: {'Content-Type': 'application/json'},
        })
        //console.log(res);
        const response = await res.json();
        setCategorias(response);
        console.log(categorias);
      }
      getCategorias();
  })

Спасибо!

Ответы [ 2 ]

2 голосов
/ 30 мая 2020

Одной из распространенных причин может быть то, что категории могут не иметь значения по умолчанию, т.е. не определены до завершения вызова rest.

, если вы зададите переменной значение по умолчанию, например '[]', это может решить вашу проблему. Или, если вы используете es2020, вы можете попробовать категории? .Map (...)

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

обновление: на основе кода useEffects вы можете проверить свою конечную точку, чтобы убедиться, что она возвращает вам массив объектов

0 голосов
/ 30 мая 2020

Что такое категории? .map - это встроенный метод прототипа массивов. Если категории не являются массивом, это может быть вашей проблемой. Я предполагаю, что вы реагируете, поэтому попробуйте выйти из категорий логирования консоли, чтобы узнать, что это за работа.

...