Javascript 如何仅在React中加载上一次获取后才加载函数?
我正在使用API构建一个迷你股票搜索应用程序,在每次渲染时,首先,在useEffect中,我从API中获取一个有效股票代码列表,并将其存储在一个数组中。然后在提交表单时,仅当用户输入了有效的股票代码时才加载特定的股票代码数据,我通过检查该股票代码是否在我获取的股票代码数组中来验证该股票代码。问题在于,每次更改应用程序后,useEffect都会重新呈现,而且由于加载需要一两秒钟,因此用于验证用户输入的数组是空的(因此拒绝每个获取股票行情数据的请求)。我已经尝试在useEffect中使用一个空的依赖性数组,但出于某种原因,这似乎阻止了fetch的加载,因为在提交表单之前必须等待一两秒钟,以确保数组已加载而没有任何依赖性Javascript 如何仅在React中加载上一次获取后才加载函数?,javascript,reactjs,fetch,Javascript,Reactjs,Fetch,我正在使用API构建一个迷你股票搜索应用程序,在每次渲染时,首先,在useEffect中,我从API中获取一个有效股票代码列表,并将其存储在一个数组中。然后在提交表单时,仅当用户输入了有效的股票代码时才加载特定的股票代码数据,我通过检查该股票代码是否在我获取的股票代码数组中来验证该股票代码。问题在于,每次更改应用程序后,useEffect都会重新呈现,而且由于加载需要一两秒钟,因此用于验证用户输入的数组是空的(因此拒绝每个获取股票行情数据的请求)。我已经尝试在useEffect中使用一个空的依赖
const allTickers = []
useEffect(() => {
fetch('https://finnhub.io/api/v1/stock/symbol?exchange=US¤cy=USD&mic=XNYS&token=************')
.then(res => res.json())
.then(data => {
for (let i = 0; i < data.length; i++) {
allTickers.push(data[i]['displaySymbol'])
}
})
fetch('https://finnhub.io/api/v1/stock/symbol?exchange=US¤cy=USD&mic=XNAS&token=**********')
.then(res => res.json())
.then(data => {
for (let i = 0; i < data.length; i++) {
allTickers.push(data[i]['displaySymbol'])
}
})
})
const handleFormSubmit = (event) => {
event.preventDefault()
if (userTickerValue !== '' && allTickers.includes(userTickerValue)) {
if (timeFrame === 'TIME_SERIES_INTRADAY') {
fetch(`https://www.alphavantage.co/query?function=${timeFrame}&symbol=${userTickerValue}&interval=5min&apikey=**********`)
.then(res => res.json())
.then(data => {
setTickerData({
symbol: data['Meta Data']['2. Symbol'],
})
console.log(data)
})
} else {
fetch(`https://www.alphavantage.co/query?function=${timeFrame}&symbol=${userTickerValue}&apikey=**********`)
.then(res => res.json())
.then(data => {
setTickerData({
symbol: data['Meta Data']['2. Symbol'],
})
console.log(data)
})
}
} else if (userTickerValue === '') {
alert('Please Enter A Ticker')
} else {
alert('Please Enter A Valid Ticker')
}
setUserTickerValue('')
}
const allTickers=[]
useffect(()=>{
取('https://finnhub.io/api/v1/stock/symbol?exchange=US¤cy=USD&mic=XNYS&token=************')
.then(res=>res.json())
。然后(数据=>{
for(设i=0;ires.json())
。然后(数据=>{
for(设i=0;i{
event.preventDefault()
if(userTickerValue!=''&&allTickers.includes(userTickerValue)){
如果(时间段===‘时间序列\日内’){
取回(`https://www.alphavantage.co/query?function=${timeFrame}&symbol=${userTickerValue}&interval=5min&apikey=********`)
.then(res=>res.json())
。然后(数据=>{
setTickerData({
symbol:data['metadata']['2.symbol'],
})
console.log(数据)
})
}否则{
取回(`https://www.alphavantage.co/query?function=${timeFrame}&symbol=${userTickerValue}&apikey=*********`)
.then(res=>res.json())
。然后(数据=>{
setTickerData({
symbol:data['metadata']['2.symbol'],
})
console.log(数据)
})
}
}else if(userTickerValue==''){
警报('请输入股票行情')
}否则{
警报('请输入有效的股票代码')
}
setUserTickerValue(“”)
}