react-bootstrap 中的 <Table> - SyntaxError答案

【问题标题】：<Table> in react-bootstrap - SyntaxErrorreact-bootstrap 中的 <Table> - SyntaxError
【发布时间】：2021-09-26 23:01:35
【问题描述】：

我正在使用 react-bootstrap 开发一个 React 项目，但在尝试在 <Table> 部分之前或之后添加 JSX 时遇到问题。

有熟悉这个问题的人吗？

return (
    
    <h1>My Schedule</h1>
    
    <Table striped bordered hover>
      <thead>
        <tr>
          <th>Time</th>
          <th>Medicine Name</th>


SyntaxError: C:\Users\hardu\Desktop\Web Development\Medisafe\dashboard\src\pages\Schedule.js: Adjacent JSX elements must be wrapped in an enclosing tag. Did you want a JSX fragment <>...</>?(22:4)       

  20 |     <h1>My Schedule</h1>
  21 |
> 22 |     <Table striped bordered hover>
     |     ^
  23 |       <thead>
  24 |         <tr>
  25 |           <th>Time</th>

【问题讨论】：

标签： reactjs syntax-error jsx react-bootstrap react-bootstrap-table

【解决方案1】：

你必须将你的 jsx 包装在一个主 div 或一个反应片段中。

return (
    <>
    <h1>My Schedule</h1>
    
    <Table striped bordered hover>
      <thead>
        <tr>
          <th>Time</th>
          <th>Medicine Name</th>
         </>

【讨论】：