vue2使用 element表格展开功能渲染子表格

 默认样式

修改后 

 样式2

模拟数据

needDataFollow: [
            {
                "bargain_time": "",
                "id": 7,
                "direction": "项目",
                "demand_content": "777",
                "report": [],
                "is_bargain": 1,
                "createtime": "2024-01-16",
                "tea": [
                    {
                        "id": 6,
                        "teacher_id": "555",
                        "teacher_name": "名字",
                        "cycle": "10",
                        "tea_money": "10.00",
                        "number": "PHAD-BJ-20240116-01"
                    }
                ]
            },
]

修改默认样式 

// 父表格颜色
/deep/.el-table th.el-table__cell {
    background: #596980 !important;
    font-size: 14px;
    font-weight: 400;
    color: #FFFFFF;
}
// 子表格颜色
#child_tab {
    /deep/ th {
        background-color: #f0f2fd !important;
        color: #000 !important;
    }
}

// 展开向右边
/deep/ .el-table__expand-icon {
    color: #29b4ff;
    font-size: 15px;

    &::before {
        content: "展开";
    }

    .el-icon svg {
        transform: rotate(0deg);
        transition: 0.3s;
    }
}

// 收起向下边
/deep/ .el-table__expand-icon--expanded {
    transform: rotate(0);

    &::before {
        content: "收起";
    }

    .el-icon svg {
        transform: rotate(90deg);
        transition: 0.3s;
    }
}