亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

如何使用 ReactJS 在表格標簽中編寫 if 條件

如何使用 ReactJS 在表格標簽中編寫 if 條件

www說 2023-03-10 13:37:50
如果條件在 ReactJS 中不起作用。我想創建一個 Accordion 并從 Excel 工作表中獲取數據。并設置 ID 的哪個數據顯示哪個按鈕,我無法創建 if 條件。{items.map((d) => (        <Accordion key={d.ID}           title={            <div>              <tr className="btn-heading">                <td>{d.ID}</td>                <td>{d.Mail}</td>                <td>{d.Name}</td>                <td>{d.PhoneNo}</td>                <td>{d.City}</td>                <td>{d.Date}</td>                <td>{d.Time}</td>              </tr>            </div>          }          content={            <div>              <p className="header">                  <span className="header-content">Shipping Address:</span>                  292 Naqshband Colony. Near rabbania Mosque. Multan              </p>              <Table size="sm">                <thead>                  <tr>                    <th>#</th>                    <th>Article No</th>                    <th>Product Name</th>                    <th>Quantity</th>                    <th>Price</th>                    <th>Total Amount</th>                  </tr>                </thead>                <tbody>                  {products.map((c) =>                  (                    if(c.ID === 1) {   <--- this if condition is not working                            <tr key={c.ID}>                        <td>{c.ArticleNo}</td>                        <td>{c.ProductName}</td>                        <td>{c.Quantity}</td>                        <td>{c.Price}</td>                        <td>{c.TotalAmount}</td>                      </tr>                     }                                                          ))};                </tbody>              </Table>這是我的代碼箱: https://codesandbox.io/s/hungry-bardeen-8m2gh ?file=/src/App.js
查看完整描述

1 回答

?
UYOU

TA貢獻1878條經驗 獲得超4個贊

您可以使用三元運算符來檢查if-else語句。


修改部分代碼如下,


改變,


{products.map((c) =>

   (

    if(c.ID === 1) {   <--- this if condition is not working      

    <tr key={c.ID}>

     <td>{c.ArticleNo}</td>

     <td>{c.ProductName}</td>

     <td>{c.Quantity}</td>

     <td>{c.Price}</td>

     <td>{c.TotalAmount}</td>

    </tr> 

   }                                        

))};

到:


   {products.map((c) =>

     c.ID === 1 ? (

     <tr key={c.ID}>

      <td>{c.ArticleNo}</td>

      <td>{c.ProductName}</td>

      <td>{c.Quantity}</td>

      <td>{c.Price}</td>

      <td>{c.TotalAmount}</td>

    </tr>

    ) : null

   )}

分叉沙盒:

https://codesandbox.io/s/romantic-shannon-10gme?fontsize=14&hidenavigation=1&theme=dark

查看完整回答
反對 回復 2023-03-10
  • 1 回答
  • 0 關注
  • 186 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號