我正在嘗試使用axios從API獲取資料，并使用鉤子在視圖中顯示。我從API那里得到了一個成功的回應，但是我不知道如何將型別整合到請求中。API給了我一個物件，所以我想這樣來宣告我的回應變數（就像下面的'Gateway'界面）
const Gateways。React.FC = () => {
介面 Gateway {
id: 數字。
name: string;
}
const [gateway, setGateway] = useState(''/span>)。
const handleClick = async ( ) => {
axios.get("my/url"/span>)
.then((response) =>/span>
setGateway(response.data)
).catch(error=>console.log(error) )。
};
return (
<div className="content"/span>>
<div>{ gateway.name }</div>/error is here: 屬性'name'不存在于'string'型別上。
)
};
export default Gateways;
謝謝你！！
uj5u.com熱心網友回復：
Gateway隱含地是一個字串型別('')，但后來你把它當作一個物件
const [gateway, setGateway] = useState(''/span>) 。/span>字串型別
<div>{ gateway. name }</div> // object type
你應該考慮 :
const [gateway, setGateway] = useState<Gateway>({}) as Gateway）。)
另外，你還缺少一個結尾的div
uj5u.com熱心網友回復：填充gateway需要時間，所以通常我們這樣做
if (!gateway) return null
return (
<div className="content">
<div>{ gateway.name }</div>/span>
</div>
)
uj5u.com熱心網友回復：
請檢查一下你的內容型別頭的回應。我認為它可能是text/plain。
如果它是text/plain，請考慮使用application/json，這樣axios就可以為你決議它。
但是，如果您不能改變內容型別，請使用 setGateway(JSON.parse(response.data)) 來將 response.data 決議為一個 JSON 物件。
另外，在沒有任何值的情況下啟動狀態，在使用狀態的地方使用gateway?.name。如果它還沒有被加載，你就不會得到這個錯誤。
uj5u.com熱心網友回復：
const [gateway, setGateway] = useState({});
你可以使用上面的格式，或者你也可以傳遞默認或初始屬性。 這將回傳一個充滿狀態的物件網關。
轉載請註明出處，本文鏈接：https://www.uj5u.com/net/322737.html
標籤：