React JS useState初始值未在JS内部更新获取API

Question

我是 React JS 的新手。 我在 contextAPI 挂钩中有 useState 和 fetchAPI，但最初的 state 没有更新。

// code

import React,{useState, createContext} from 'react'


export const contextApi = createContext()

export const ContextApiProvider = (props) => {

    
const [query, setQuery] = useState('chicken')
const [recipes, setRecipes] = useState([])

const api_props = {
    APP_ID: '84cf712e',
    APP_KEY:'asdcb2b8b842f3e543casjakfa710de4fb343592a64d',
    APP_QUERY: query
  }
  
 fetch(`https://api.edamam.com/search?q=${api_props.APP_QUERY}&app_id=${api_props.APP_ID}&app_key=${api_props.APP_KEY}`)
.then(res => res.json()).then(data => setRecipes(data.hits))


    return (
        <contextApi.Provider value={{recipes}}>
            {props.children}
        </contextApi.Provider>
    )
}

Answer 1

首先查找你想要获取数据的 useEffect 钩子。 从那里您可以使用您正在运行的 setState 挂钩设置 state。 这可能会创建一个无限循环，因为您正在设置 state 重新运行该组件然后尝试再次设置 state。

希望这有助于让我知道您是否有任何问题。