useState react hook 不设置数组状态

Question

我正在尝试将视频状态设置为来自 api 的响应的 items 数组，但是当我对视频进行 console.log 时，它返回一个空数组......这是获取 api 的代码，我在其中设置了视频状态

const [videos, setVideos] = useState([]);
const handleFormSubmit = async (searchterm) => {
    await fetch(
      `https://www.googleapis.com/youtube/v3/search?${params.toString()}&q=${searchterm}`
    )
      .then((response) => response.json())
      .then((data) => {
        console.log(data);
        setVideos(data.items);
        console.log(videos);
      });
  };

如何将 items 数组设置为视频状态？

Answer 1

Ciao，不幸的是，使用钩子您无法videos在setVideos调用后登录，因为它setVideos是异步的。

要获得最后一个值，videos您必须以useEffect这种方式使用钩子：

useEffect(() => {
   console.log(videos);
}, [videos]);