Javascript UseEffect在开始时为空

我正在尝试使用钩子创建一个组件。 在useffect内部，我调用了一个函数，但它不起作用。我认为这是因为当应用程序启动时，道具是空的，而在第二个应用程序启动时，道具是满的，所以不会再次调用该函数。。 为什么我做错了？ 谢谢（对不起我的英语不好）

代码如下：

import React, { useState, useEffect } from "react";

const fetchContent = async content => {
  console.log(content) // is empty in the first console, and full in the second.
  const data = [];

  for await (const item of content) {
     data.push({ componentName: item.nombre});
  }
  return data;
};

function ContentGroups(props) {
  const [contentResult, setResult] = useState([]);

   useEffect(() => {
     fetchContent(props.info).then(data => setResult(data));
     console.log(contentResult) // is empty in the first console, and full in the second.
  }, []);

  return (
    <React.Fragment>
       {contentResult.map((el, index) => {
        switch (el.componentName) {
          case "top":
            return <h1>soy un top words</h1>/*
        }
      })}
    </React.Fragment>
  );
}

import React，{useState，useffect}来自“React”；
const fetchContent=异步内容=>{
console.log（content）//在第一个控制台中为空，在第二个控制台中为满。
常量数据=[]；
用于等待（内容的常量项）{
push（{componentName:item.nombre}）；
}
返回数据；
};
功能内容组（道具）{
const[contentResult，setResult]=useState（[]）；
useffect（（）=>{
fetchContent（props.info）.then（data=>setResult（data））；
console.log（contentResult）//在第一个控制台中为空，在第二个控制台中为满。
}, []);
返回(
{contentResult.map（（el，index）=>{
开关（el.组件名称）{
案例“顶部”：
返回最上面的单词/*
}
})}
);
}

尝试在

useffect

deps数组中添加道具依赖项：

useEffect(() => {
  fetchContent(props.info).then(data => setResult(data));
}, [props.info]);

为什么你的例子不起作用

首先，在

setState

异步时记录数据，

console.log（contentResult）

将记录更新前的当前状态

---

其次，使用空的dep数组运行

useffect

，这意味着在组件装载时运行一次。

尝试在

useffect

deps数组中添加道具依赖项：

useEffect(() => {
  fetchContent(props.info).then(data => setResult(data));
}, [props.info]);

为什么你的例子不起作用

首先，在

setState

异步时记录数据，

console.log（contentResult）

将记录更新前的当前状态

---

其次，使用空的dep数组运行

useffect

，这意味着在组件挂载上运行一次。

console.log

会在得到结果之前打印出来

useffect（（）=>{
获取内容（props.info）。然后（data=>{
设置结果（数据）；
控制台日志（数据）；
});
}, []);

console.log

在获得结果之前打印

useffect（（）=>{
获取内容（props.info）。然后（data=>{
设置结果（数据）；
控制台日志（数据）；
});
}, []);
console.log（）
应该在
then中。（
block-tooth
console.log（）
也应该在
then中。（
block-tooth