我在useState更新状态onSubmit时遇到麻烦。
这是一个用于学习React Hooks的简单天气应用程序。我已经多次阅读Dan Abramov的博客文章,了解如何使用useEffect。我试图在Stackoverflow上找到与我的问题接近的东西,但它没有点击。
const [search, setSearch] = useState('')
// Query term
const [query, setQuery] = useState('indianapolis')
// API search results
const [data, setData] = useState([])
useEffect(() => {
let didCancel = false
const getWeather = async () => {
try {
const response = await fetch(`${baseUrl}?
q=${query}&APPID=${apiKey}`)
const data = await response.json()
if (!didCancel) {
setData(data)
}
} catch (error) {
if (!didCancel) {
throw new Error()
}
}
}
getWeather()
return () => {
// useEffect cleanup function
didCancel = true
}
}, [query])
const getSearchResults = e => {
e.preventDefault()
setQuery(search)
props.history.push('/weather', [data])
setSearch('')
}
我希望getSearchResults()函数使用搜索项更新setQuery函数。我使用了console.log,发现我的状态落后了一步。当我搜索时,第一个返回值是我的查询初始值。任何帮助,将不胜感激。