带有数据库数据的 Material UI 选择组件

Question

我正在尝试使用数据库中的数据填充 Material UI 中的选择组件。我可以成功地显示组件中的数据，但是当我选择一个选项时，它会中断并显示以下错误“categorias.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();
  })

谢谢你！

Answer 1

类别是什么类型？.map 是数组原型的内置方法。如果类别不是数组，那可能是您的问题。我猜你正在反应，所以尝试控制台记录类别以查看它正在运行。