Article From:https://segmentfault.com/q/1010000012146114

element tablelink

As shown, the merge header of the element UI table component is similar to that, and only the header on the top can be merged. I would like to know if you need the left side, you need to merge (as shown below) to modify it. Please give your advice.

Answer 0:

The latest version of the combined style, element, is provided.

  <el-table :data="tableData2" border style="width: 100%">                                                                               
                                  <el-table-column width='400'  label="The nature of output factor ">< template scope= "scope" >< P v-show= "scope.row.show" > {{scope.row.nature}}< /p> < el-inputType= "textarea": autosize= "{minRows: 2, maxRows: 4}" v-show= "! Scope.row.show" v-model= "scope.row.n"Ature "> < /el-input>< /template>< /el-table-column>< el-table-column LAbel= "specific output" >< template scope= "scope" >< div class= "content-rowspan" >< div v-for= "(list, index) in scope.row.lists" > < P v-show= "<";El-button class= "delelist" type= "danger" size= "small" @click= "delelist" (tableData2, scope.$index, tableData2)Ex) "> delete < /el-button> < /p> < el-input type=" textarea ": autosize=" {24}: "v-show="! Scope.row.show "v-model=" scope.row.lists[index] ">"; < /el-input> < /div>< div> < el-button size= "small" type= "PRImary "icon=" plus "@click=" addlist (tableData2, scope.$index) "> < /el-button> <";< /div>< /templatE>< /el-table-column>< el-table-column width='200'label= "operation" >< template SCOpe= "scope" >< el-button @click.native.prevent= "deleteRow (scope.$index, tableData2)" type= "danger" size= "small">delete&lT; /el-button>< el-button @click.native.prevent= "eDitRow (scope.$index, tableData2) "type=" primary "size=" small ">";edit< /el-button>< el-button @click.native.prevent= "keep (scope.$index, tableData2,2)" type= "Success "size=" small ">Preservation< /el-button>< /template>< /el-table-column>< /el-table>

Link of this Article: Element UI header merging problem

Leave a Reply

Your email address will not be published. Required fields are marked *