如何使用React从状态内传递来自axios的数据？
如何使用React从状态内传递来自axios的数据？
提问于 2022-10-03 08:58:03
我有一个api (一个对象的arr )，我需要将它传递到一个状态，这样我就可以在一个组件中传递数据，以便在网站上显示它。
第一种方法：
// pulls the api data
const newData = axios.get(url).then((resp) => {
const apiData = resp.data;
apiData.map((video) => {
return video;
});
});
// sets the state for the video
const [selectedVideo, setSelectedVideo] = useState(newData[0]);
const [videos] = useState(videoDetailsData);
...
return (
<>
<FeaturedVideoDescription selectedVideo={selectedVideo} />
</>
)第二种方法：
const useAxiosUrl = () => {
const [selectedVideo, setSelectedVideo] = useState(null);
useEffect(() => {
axios
.get(url)
.then((resp) => setSelectedVideo(resp.data))
});
return selectedVideo;
}
...
return (
<>
<FeaturedVideoDescription selectedVideo={selectedVideo} />
</>
)这两种方法似乎都行不通。我在这里错过了什么？
回答 1
Stack Overflow用户
回答已采纳
发布于 2022-10-03 09:08:03
正确的方法是在useEffect函数中调用axios方法。
const fetchData = axios.get(url).then((resp) => setSelectedVideo(resp.data)));
useEffect(() => {
fetchData();
}, [])或者如果你需要async/await
useEffect(() => {
const fetchData = async () => {
const response = await axios.get(url);
setSelectedVideo(resp.data);
}
fetchData();
}, [])页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/73933173
复制相关文章
相似问题
腾讯云开发者
