問(wèn)題：我能夠在 componentDidMount 中使用 axios 進(jìn)行 web api 調(diào)用，然后在 Render 中我可以使用 .map 循環(huán)遍歷數(shù)據(jù)并使用 table 和 bootstrap 類創(chuàng)建 html。我遇到的問(wèn)題是我需要有按鈕來(lái)顯示它們是否是本地存儲(chǔ)中的成員。因此，現(xiàn)在我認(rèn)為我需要將所有內(nèi)容移出 Render() 并放置循環(huán)和 if/else 檢查以在 webapi .then 部分中顯示正確的按鈕使用 axios 調(diào)用中的 html 表和數(shù)據(jù)執(zhí)行此操作的最佳方法是什么？componentDidMount 與 Axios web api 調(diào)用： componentDidMount() {    webApi.get('sai/getofflinemembers?userId=N634806')        .then((event) => {          // Instead of looping with .map in the render(), thinking I need to          // do the looping inside here to correctly create the correct element           // with the right color button and text           for (var i = 0; i < event.data.length; i++) {             //check with local storage if the memberid exist             // need to use a different button style and text             if (localStorage.getItem(event.data[i]["Member_ID"]) != null) {                //document.getElementById(event.data[i]["Member_ID"]).classList.remove('btn-warning');                //above would be after                 // need to DO ALL in render  const contents html table in here                 // <button id={item.Member_ID} type="button" onClick={(e) => this.downloadUser(item.Member_ID,e)}                   className="btn btn-success">SAI</button>             }          }          this.setState({                data: event.data          });    });使成為： render() {    const contents = this.state.data.map(item => (         <tr>              <td>{item.Member_Name}</td>               <td>{item.Member_ID}</td>              <td>{item.Member_DOB}</td>              <td>{item.ProgramType}</td>              <td>                <button id={item.Member_ID} type="button" onClick={(e) => this.downloadUser(item.Member_ID,e)}                   className="btn btn-warning">Ready for Download</button>              </td>         </tr>        ))        return(         ....         {contents}         ....        )    }