0

我是React 功能组件的初学者,我试图习惯使用React Hooks来理解 Hooks 的逻辑。就我而言;我想从名为getPlants的 API 中获取我的初始数据——我将在我的默认仪表板页面上显示这些数据。从文档中,我了解到在 react hooks 中发送 API 请求的最佳实践是在UseEffect Hook中进行 API 调用。所以我在 UseEffect 挂钩中调用我的getPlants方法,并使用名为setRows的useState挂钩设置我的响应数据。它成功设置了名为row的状态,但在那一行之后,我无法在我的名为row的状态中获取任何数据,只是一个空数组。在那之后的其他方法中,我不能使用值导致我再次变空。那么我应该对我的行状态做些什么来获取和处理完整的数据呢?希望清楚明白。

 const [rows, setRows] = useState([])

 useEffect(() => {

   getPlants()

 }, [])               //dependency array empty because ı want it to work one time (like compDidMount)

 const getPlants= () =>{
      fetch('http://localhost:3001/api/getPlants',{
       method:'GET',
       headers:{
         'Content-Type':'application/json'
       }
     }).then(res => res.json())
     .then(resultJson => {setRows(resultJson)})    //sets the state named row successfully with response data
     
     console.log(rows)           //gets an empty array
 }
4

0 回答 0