如何向ReactDOM展示接口信息？
如何向ReactDOM展示接口信息？
提问于 2021-11-05 16:48:48
目前我正在获取股票数据，从雅虎金融在快速API。我能够将股票的'bid‘记录到控制台，并将任何信息记录到控制台。然而，我似乎找不到一个解决方案，如何在浏览器中将其显示在一个简单的网页上。
这是我到目前为止所拥有的
import React from "react";
const Test = () => {
fetch("https://yh-finance.p.rapidapi.com/market/v2/get-quotes?region=US&symbols=VTI%2C%20AAPL%2CTSLA%2CFB", {
"method": "GET",
"headers": {
"x-rapidapi-host": "yh-finance.p.rapidapi.com",
"x-rapidapi-key": "api-key"
}
})
.then(res => res.json())
.then(res => {
console.log(res.quoteResponse.result[3].bid)
})
return (
<>
<h1>{}</h1>
</>
)
}
export default Test回答 1
Stack Overflow用户
发布于 2021-11-05 16:56:48
您需要使用useState来管理存储您的state响应的api，并使用useEffect来更好地管理api调用。阅读上下文api的文档。
同时，下面的解决方案应该是可行的
import React, {useState, useEffect} from "react";
const Test = () => {
const [apiResponse, setApiResponse] = useState('')
useEffect(() => {
fetch("https://yh-finance.p.rapidapi.com/market/v2/get-quotes?region=US&symbols=VTI%2C%20AAPL%2CTSLA%2CFB", {
"method": "GET",
"headers": {
"x-rapidapi-host": "yh-finance.p.rapidapi.com",
"x-rapidapi-key": "api-key"
}
})
.then(res => setApiResponse(res.json()))
.then(res => {
console.log(res.quoteResponse.result[3].bid)
})
},[])
return (
<>
<h1>{apiResponse}</h1>
</>
)
}
export default Test页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/69856626
复制相关文章
相似问题
腾讯云开发者
