我有一個簡單的應用程序,它請求 API 以檢索訂單。它是帶有打字稿的反應功能組件。我只想顯示所有廣告的描述。我在這里查看了許多教程和線程,并使用 更改狀態useEffect,其中包含函數,該函數從 API 請求數據并將其傳遞給useState。一開始,我認為useEffect在父級中使用 useState 并將 props 中的廣告傳遞給子級就足夠了。后來我在子()文件中做了同樣的事情GeneralAdvert.ts,但我仍然有同樣的錯誤:×TypeError: adverts.map is not a functionGeneralAdvertD:/reactPhoraTS/reactapp/src/components/Adverts/GeneralAdvert.tsx:19 16 | }); 17 | 18 | > 19 | return <div> | ^ 20 | { 21 | adverts.map(advert=> ( 22 | <p key={advert._id}> {advert.desc} </p>這是父母:import React, { useState, useEffect } from 'react';import GeneralAdvert from './components/Adverts/GeneralAdvert';import FunctionService from './Services/FunctionService';import Advert from './Entities/Advert';import IAdvert from './Entities/IAdvert';const fs = new FunctionService();function App() { let [adverts, setAdverts] = useState<Advert[]>([]); useEffect(() => { const fetchAdverts = async () =>{ const result = await fs.getAdvertAsync(); console.log(result) setAdverts(result); } fetchAdverts(); },[]); return ( <div className="App"> <GeneralAdvert items={adverts}/> </div> );}export default App;這是孩子:import React, { useState, useEffect } from 'react';import Advert from '../../Entities/Advert';import IAdvert from '../../Entities/IAdvert';interface IGeneralAdvert { items: Array<Advert> } function GeneralAdvert(props:IGeneralAdvert) { const [adverts, setAdverts] = useState<Advert[]>([]); useEffect(() => { console.log(props.items) setAdverts(props.items); }); return <div> { adverts.map(advert=> ( <p key={advert._id}> {advert.desc} </p> ))} </div> //tried at the beggining with using just props.items //and without setAdvert in useEffet() here, but he same outcome // <div> // {props.items.map(x => <h2>{x.desc}</h2>)} // </div> }
在 useEffect 中使用 useState 時 Map 不是函數
qq_笑_17
2023-02-17 17:30:58