axios是否需要额外的配置才能从REST获取数据？
axios是否需要额外的配置才能从REST获取数据？
提问于 2022-11-30 11:09:40
我试图用get方法将fetch API转换为axios。在此之前，我计划继续使用‘异步，等待’。
当我替换下面的代码时：
// before
const fetchPlanets = async () => {
const res = await fetch("http://swapi.dev/api/planets/");
return res.json();
};
// after
const fetchPlanets = async () => {
const res = await axios
.get("http://swapi.dev/api/planets/")
.then((respond) => {
respond.data;
});
};res.json();
- Also...axios形式的
- 和返回的const不需要res.json，因为它以json类型返回。
到目前为止我就是这么理解的。使用fetch API，这一工作完美无缺。
代码应该如何让axios像我所期望的那样工作呢？
// Planets.js
import React from "react";
import { useQuery } from "react-query";
import Planet from "./Planet";
// import axios from "axios";
const fetchPlanets = async () => {
const res = await fetch("http://swapi.dev/api/planets/");
return res.json();
};
const Planets = () => {
const { data, status } = useQuery("planets", fetchPlanets);
console.log(data);
return (
<div>
<h2>Planets</h2>
{status === "loading" && <div>Loading data...</div>}
{status === "error" && <div>Error fetching data!</div>}
{status === "success" && (
<div>
{data.results.map((planet) => (
<Planet key={planet.name} planet={planet} />
))}
</div>
)}
</div>
);
};
export default Planets;和Planet.js；以防万一。
import React from "react";
const Planet = ({ planet }) => {
return (
<div className="card">
<h3>{planet.name}</h3>
<p>Population - {planet.population}</p>
<p>Terrain - {planet.terrain}</p>
</div>
);
};
export default Planet;回答 1
Stack Overflow用户
回答已采纳
发布于 2022-11-30 11:20:38
在axios代码中有两个问题。
- 您应该返回respond.data.
- 您应该返回整个axios响应.
所以这样做是可行的：
const fetchPlanets = async () => {
return await axios
.get("http://swapi.dev/api/planets/")
.then((respond) => {
return respond.data;
});
};页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/74626802
复制相关文章
相似问题
腾讯云开发者
