element-ui实现table表格的嵌套（table表格嵌套）功能实现
最近在做电商类型的官网，希望实现的布局如下：有表头和表身，所以我首先想到的就是table表格组件。
表格组件中常见的就是：标题和内容一一对应：
像效果图中的效果，只用基础的表格布局是不行的，因此我想到了table表格中的展开功能：
然后通过：默认展开所有行
然后在里面的表格table中默认隐藏表头：
其他的则需要通过样式进行实现了
element-ui中table表格的嵌套（代码部分）
<el-table v-bind:data="tableData" :default-expand-all="true" class="parentTable"
ref="multipleTable"
v-loading="loading"
element-loading-text="拼命加载中">
<el-table-column type="expand">
<template slot-scope="props">
<div class="conWrap" style="text-align: left;line-height: 16px;font-size: 14px;position: relative;top: -10px;">
<span>订单包号：{{props.row.OrderNo}}</span>
<span style="margin-left:42px;">付款时间：{{props.row.CreateTime}}</span>
</div>
<el-table v-bind:data="props.row.OrderDetails" :default-expand-all="true" stripe :show-header="false" class="childTable">
<el-table-column prop="PartNo" align="center"
label="产品型号"
width="180">
<template slot-scope="scope">
<div class="name-b">{{scope.row.PartNo}}</div>
</template>
</el-table-column>
<el-table-column prop="Mfg"
label="品牌" width="199">
<template slot-scope="scope">
<div class="name-b">{{scope.row.Mfg}}</div>
</template>
</el-table-column>
<el-table-column prop="Package"
label="封装" width="114">
<template slot-scope="scope">
<div class="name-b">{{scope.row.Package}}</div>
</template>
</el-table-column>
<el-table-column prop="miaoshu"
label="描述" width="300">
<template slot-scope="scope">
<div class="name-b" style="width:100%;">72MHZ 20KB 37 2V~3.6V-40°C~85°C（TA）