Javascript 语义UI React：无法从REST API获取下拉列表的值

我正在尝试使用语义UI React的下拉元素。这意味着要与RESTAPI一起工作，该API允许获取电影列表。React配置为从适当的RESTAPI应用程序获取数据（这已经适用于前端的其他元素）

我想获得电影名称列表作为选项。请看一下下面的JS代码段

import React, { useState, useEffect } from "react";
import { Dropdown } from "semantic-ui-react";

export const MovieDropdown = () => {
  const [movie, setMovie] = useState("");
  const [movieOptions, setMovieOptions] = useState([]);

  useEffect(() => {
    fetch("/movies")
      .then((response) => response.json())
      .then((data) =>
        setMovieOptions(
          data.map((x) => {
            return { key: x.name, text: x.name, value: x.name };
          })
        )
      );
  }, []);

  return (
    <Dropdown
      placeholder="Select Movie"
      search
      selection
      options={movieOptions}
      onChange={(e) => setMovie(e.target.value)}
    />
  );
};
export default MovieDropdown;

import React，{useState，useffect}来自“React”；
从“语义ui反应”导入{Dropdown}；
导出常量电影下拉列表=（）=>{
const[movie，setMovie]=useState（“”）；
const[movieOptions，setMovieOptions]=useState（[]）；
useffect（（）=>{
获取（“/movies”）
.then（（response）=>response.json（））
。然后（（数据）=>
设置电影选项(
data.map（（x）=>{
返回{key:x.name，text:x.name，value:x.name}；
})
)
);
}, []);
返回(
setMovie（e.target.value）}
/>
);
};
导出默认电影下拉列表；

---

我无法从中找到它。

您的代码看起来不错。改变一件小事，它就会起作用：

onChange={e=>setMovie（e.target.value）}//不能在setState中使用事件。进一步检查onChange事件的第二个参数

到

onChange={（e，{value}）=>setMovie（value）}

结帐

这是完整的工作代码

import React，{useState，useffect}来自“React”；
从“语义ui反应”导入{Dropdown}；
导出常量电影下拉列表=（）=>{
const[movie，setMovie]=useState（“”）；
const[movieOptions，setMovieOptions]=useState（[]）；
useffect（（）=>{
获取（“/movies”）
.then（（response）=>response.json（））
。然后（（数据）=>
设置电影选项(
data.map（（x）=>{
返回{key:x.name，text:x.name，value:x.name}；
})
)
);
}, []);
返回(
setMovie（值）}
/>
);
};
导出默认电影下拉列表；