动态获取表格并且合并

let mergeKeys = {};
// 计算那些行需要合并，合并的行数
data.map((item) => {
// 第一级分类
const key = item.courseModualName;courseModualName（这就是需要合并项的值）
const value = mergeKeys[key];
if (value) {
mergeKeys[key]++;
} else {
mergeKeys[key] = 1;
}
});

合并的内容

< tbody>
< tr>
< td >课程模块< /td>
< td >课程类别< /td>
< td >已录课程门数< /td>
< td >已录学分</ td>
< td >已录学时 < /td>
< td >最低学分要求</ td>
< td >最高学分要求< /td>
< /tr>
< /tbody>
{data.map((item, index) => {
console.log(item);
let rowSpan = 0;

          // 第一级分类--设置合并的行数(从每一类的第一条数据开始合并)
        	  if (index == 0) {
            rowSpan = mergeKeys[item.courseModualName];courseModualName（这个值就是需要合并的内容值）
          } else if (index > 0 && item.courseModualName !== data[index - 1].courseModualName) {
            rowSpan = mergeKeys[item.courseModualName];
          }
          // 隐藏和上一行相同的td
          if (index > 0 && item.courseModualName === data[index - 1].courseModualName) {
            rowSpan = 0;
          }
          console.log('rowSpan',rowSpan,'++++++')
          
          return (
            <tr key={index}>
              {rowSpan > 0 && <td rowSpan={rowSpan}>{item.courseModualName}</td>}
              <td >{item.courseCategorlName}</td>
              <td>{item.hasInputCourseCount}</td>
              <td >{item.hasInputCredit}</td>
              <td >{item.hasInputHour}</td>
              <td >{item.minCredit}</td>
              <td >{item.maxCredit}</td>
            </tr>
          );
        })}
      </tbody>
    </table>
  </div>

这是合并出来的效果 动态的合并表格
这是需要合并的内容区域

这是合并的方法