我正在使用react引导表here

您可以看到工作代码here

我想创建一个类似这样的表。

我的数据如下所示

const data = [
      {
        rollId: 1,
        name:"Momo",
        marks: {
          maths: 30,
          english:24,
          science:50,
          arts:10
        },
        age:14
      },
      {
        rollId: 2,
        name:"Sana",
        marks: {
          maths: 30,
          english:24,
          science:50,
          arts:10
        },
        age:14
      },
      {
        rollId: 3,
        name:"Mark",
        marks: {
          maths: 30,
          english:24,
          science:50,
          arts:10
        },
        age:14
      }
    ]

我使用了以下代码

<Table
              striped
              bordered
              hover
              responsive
              bgcolor="white"
              size="lg"
              style={{ opacity: "0.8" }}
            >
              <thead
                style={{ backgroundColor: "#198754" }}
                className="text-white"
              >
                <tr>
                  
                 
                  <th rowSpan={2}>ROll ID</th>
                  <th rowSpan={2}>Name</th>
                  
                  <th rowSpan={2} colSpan={4} >
                     <tr>
                      <th colSpan={4}>Marks</th>
                     </tr>
                    <tr>
                     <th rowSpan={1}>Maths</th>
                     <th rowSpan={1}>English </th>
                     <th rowSpan={1}>Science</th>
                     <th rowSpan={1}>Arts</th>
                    </tr>
                  </th>
                  <th rowSpan={2}>Age</th>
                  
                </tr>
              </thead>
              <tbody>
                {data.map((dat) => {
                  return (
                    <tr key={dat.rollId}>
                      <td key={dat.rollId}>{dat.rollId}</td>
                      
                      <td>{dat.name}</td>
                     
                      <td>{dat.marks.maths}</td>
                      <td>{dat.marks.english}</td>
                      <td>{dat.marks.science}</td>
                      <td>{dat.marks.arts}</td>
                    
                      <td >{dat.age}</td>
                      
                      
                    </tr>
                  );
                })}
              </tbody>
            </Table>

但是它没有显示4列的主题。请帮助我创建此表