Почему я получаю пустой объект с помощью React Hooks?

Я новичок в функциональных компонентах React и пытаюсь привыкнуть к React Hooks , чтобы понять логику Hooks. В моем случае; Я хочу получить свои исходные данные, которые я буду показывать на своей странице панели инструментов по умолчанию, из API в методе с именем getPlants. Из документации я узнал, что наилучшая практика отправки запросов API в хуках реагирования — это вызовы API в хуке UseEffect . Итак, я вызываю свой метод getPlants в хуке UseEffect и устанавливаю данные ответа с помощью хука useState с именем setRows . Он успешно устанавливает строку с именем состояния , но после этой строки я не могу получить данные в строке с именем моего состояния., просто пустой массив. Также в других методах после этого я не могу использовать значение строки , потому что я снова стану пустым. Итак, что я должен сделать с моим состоянием строки, чтобы получить и обработать полные данные? Надеюсь, это ясно для понимания.

       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
 }

0 ответов

Другие вопросы по тегам