为什么 Map 值不显示在反应中的模态体内 bootstrap

Question

我有一个要求，当我点击一个按钮时，我应该使用 React bootstrap.

显示一个模式弹出框

But the value is not displaying inside modal body.

when I puted log, in the console it is printing all the values. But the same value I want to try to print on the modal body is not printing.

这是示例代码 ` 函数 MyVerticallyCenteredModal(props) {

return（

  <Modal scrollable={true}
     {...props}
     size="lg"
     aria-labelledby="contained-modal-title-vcenter"
     centered
  >
     <Modal.Header closeButton>
        <Modal.Title id="contained-modal-title-vcenter">
           Order Id - {props.order.orderId}
        </Modal.Title>
        
     </Modal.Header>
     <Modal.Body>
        <table>
           <tbody>
              {
                 
                 props.order.foods.map((food,id)=>{
                    console.log(food);
                    <tr>
                       <td>{food}</td>
                    </tr>
                 })
              }
           </tbody>
        </table>
     </Modal.Body>
     <Modal.Footer>
        {/* <Button onClick={props.onHide}>Close</Button> */}
     </Modal.Footer>
  </Modal>

); }`

谁能帮我解决这个问题
```
 Thanks in advance.
```

Answer 1

你没有在你的代码中使用 return，这就是为什么你的地图没有 return 任何东西，试试这个，

 <tbody>
              {
                 
                 props.order.foods.map((food,id)=>{
                    console.log(food);
                   return (
                       <tr>
                         <td>{food}</td>
                       </tr>
                        )
                 })
              }
           </tbody>

为什么 Map 值不显示在反应中的模态体内 bootstrap

Why Map value are not displaying inside modal body in react bootstrap

javascript

reactjs

react-bootstrap