Vue 实战-4 表格展开行

当表格横着一行不想放那么多数据，会显得很紧，也没有重点，所以只希望放一些重要信息，其他的可以通过展开行来展示

 

需要在表格的每一行加一列：

    实际中应用：

        <el-table-column type="expand">  

            <template slot-scope="props">     

                <el-form label-position="left" class="demo-table-expand">       

                    <el-form-item label="域名">         

                        <span>{{ props.row.uniq_domain }}</span>       

                    </el-form-item>       

                    <el-form-item label="是否在kts">         

                        <span>{{ props.row.in_kts }}</span>       

                    </el-form-item>       

                    <el-form-item label="是否在kngx">         

                        <span>{{ props.row.in_kngx }}</span>       

                    </el-form-item>       

                    <el-form-item label="泛域名">         

                        <span>{{ props.row.wildcard_domain }}</span>       

                    </el-form-item>       

                    <el-form-item label="解析结果">         

                        <span>{{ props.row.parse_result }}</span>       

                    </el-form-item>       

                    <el-form-item label="Cname">         

                        <span>{{ props.row.cname }}</span>       

                    </el-form-item>       

                    <el-form-item label="Vip">         

                        <span>{{ props.row.vip }}</span>       

                    </el-form-item>       

                </el-form>   

            </template> 

        </el-table-column>