Beim Aufruf einer Funktion in der Tabelle ein Promise zurückgeben: Versuchen Sie, einen Promise-Funktionsaufruf zurückzugeben

Question

let data = [223, 34, 456, 56, 67];

Funktion getDataFromApi(paramfromTableCell){
let postData = {data: paramfromTableCell}
   let result = apiResponse(url, 'post', postData).catch((err => console.log(err)))
   Ergebnis zurückgeben;
}

data.map((value)=>{
 zurückkehren(
       <th>{getDataFromApi(value)}</th>
 )
})

Eine Funktion in einer Tabellenzelle aufrufen, aber ein Promise zurückgeben. Wenn die Funktion aufgerufen wird, nimmt sie einen Parameter und gibt den Namen basierend auf der Nummer zurück, aber sie gibt ein Versprechen zurück. Gibt es eine Möglichkeit, dieses Problem zu lösen?

Answer 1

你必须await这个promise来获取结果。否则你只会得到这个promise。所以在你的map函数中添加async，然后使用await：

data.map(async (value)=>{
  return(<th>{await getDataFromApi(value)}</th>
)

Answer 2

看起来你正在使用React。你需要将你的响应保存到React的状态中。

这是一个示例代码，它应该是这样的（未经测试）：

let data = [223, 34, 456, 56, 67];
const [responses, setResponses]  = useState([]);

useEffect(() => {
   const getAllResponses = () => Promise.all(
       data.map(val =>  getDataFromApi(val))
   );

   getAllResponses().then(responses => setResponses(responses));
}, [data])

function getDataFromApi(paramfromTableCell){
    let postData = {data : paramfromTableCell}
    return apiResponse(url, 'post', postData).catch((err => console.log(err)))
}

responses.map((value)=>{
 return(
       <th>{value}</th>
 )
})