如何在<h1>這個專案中顯示名稱和id 用axios獲取api
import React, { useState } from "react";
import axios from "axios";
const Details = () => {
const [data, setData] = useState({
name: "",
id: "",
});
const apiDetails = () => {
axios
.get(`https://api.coingecko.com/api/v3/coins/${"ethereum"}`)
.then((response) => {
// console.log(response);
setData({
name: response.data.name,
id: response.data.id,
});
return setData;
});
};
return (
<div>
<h1>{setData.name}</h1>
<h1>{data.name}</h1>
<h1>{setData.id}</h1>
<h1>{data.id}</h1>
<h1>{setData.name}</h1>
</div>
);
};
export default Details;
uj5u.com熱心網友回復：
您應該使用 a as so，您可以在此處useEffect了解有關此鉤子的更多資訊
import React, { useState, useEffect } from "react";
import axios from "axios";
const Details = () => {
const [data, setData] = useState(null);
const apiDetails = () => {
axios
.get(`https://api.coingecko.com/api/v3/coins/${"ethereum"}`)
.then((response) => {
// console.log(response);
//setData({
// name: response.data.name,
// id: response.data.id,
// });
return response;
});
};
useEffect(() => {
(async () => {
const response = await apiDetails();
setData({
name: response.data.name,
id: response.data.id,
});
})();
}, [])
if (data) {
return (
<>
<h1>{data.name}</h1>
<h1>{data.id}</h1>
</>
);
}
return null;
};
export default Details;
轉載請註明出處，本文鏈接：https://www.uj5u.com/caozuo/411067.html
標籤：
上一篇：如何更改陣列中的一種材質紋理？