In diesem Artikelbeispiel wird der spezifische Code von el-table zur Realisierung der Zusammenführung von Zellen zu Ihrer Information geteilt. Der spezifische Inhalt ist wie folgt el-table Zellen zusammenführen (vue+element) - Zuerst in el-table einfügen: span-method="arraySpanMethod" <el-table :header-cell-style="{background:'#eef1f6',color:'#606266'}" :data="merchantList" border :span-method="arraySpanMethod"> <el-table-column align="center" prop="provinceName" label="Provinz"> </el-table-column> <el-table-column align="center" label="Agentenname"> <Vorlage Umfang="Umfang"> <span>{{scope.row.parentMerchantName == scope.row.merchantName ? '---' : scope.row.parentMerchantName}}</span> </Vorlage> </el-Tabellenspalte> <el-table-column align="center" prop="cityName" label="Stadt"> </el-table-column> <el-table-column align="center" prop="countryName" label="Land"> </el-table-column> <el-table-column align="center" prop="merchantName" label="Händlername"> </el-table-column> </el-Tabelle> Schreiben Sie die Methode in Methoden: //Zellen zusammenführen arraySpanMethod ({ row, column, rowIndex, columnIndex }) { if (columnIndex === 0) {//Merge-Methode für die erste Spalte, Provinz const _row_1 = this.provinceArr[rowIndex]; const _col_1 = _row_1 > 0 ? 1 : 0; //Wenn es zusammengeführt wird, _row=0, dann muss diese Spalte gelöscht werden return { Zeilenbereich: _Zeile_1, colspan: _col_1 } } }, // Initialisiere merageInit () { diese.provinceArr = [] diese.provincePos = 0 }, //Methode zum Zusammenführen von Arrays merge() { dies.merageInit() für (var i = 0; i < this.merchantList.length; i++) { wenn (i === 0) { //Die erste Zeile muss vorhanden sein this.provinceArr.push(1) diese.provincePos = 0 } anders { // Bestimmen Sie, ob das aktuelle Element mit dem vorherigen Element identisch ist. this.provincePos ist die Seriennummer des ProvinceArr-Inhalts //province if (this.merchantList[i].provinceName === this.merchantList[i - 1].provinceName) { diese.provinzArr[diese.provinzPos] += 1 diese.provinceArr.push(0) } anders { diese.provinceArr.push(1) diese.provincePos = i } } } }, Ergebnisse: Das Obige ist der vollständige Inhalt dieses Artikels. Ich hoffe, er wird für jedermanns Studium hilfreich sein. Ich hoffe auch, dass jeder 123WORDPRESS.COM unterstützen wird. Das könnte Sie auch interessieren:
|
<<: Kenntnisse über die MySQL Memory-Speicher-Engine
>>: Das Konzept von MTR in MySQL
Virtuelle Maschinen sind eine sehr praktische Tes...
Inhaltsverzeichnis Problemanalyse Warum Kapselung...
Inhaltsverzeichnis Vorwort 1. Allgemeine Fehlerbe...
Inhaltsverzeichnis 3 Möglichkeiten zum Bereitstel...
In diesem Artikel finden Sie das grafische Tutori...
Ein Designsoldat fragte: „Kann ich nur reines Des...
Inhaltsverzeichnis Vorwort Aufzählbare Eigenschaf...
Problembeschreibung In unseren Projekten sind hor...
Inhaltsverzeichnis 1. Was ist Dekonstruktion? 2. ...
Im Lernprogramm zum Docker-System haben wir geler...
In diesem Artikel finden Sie den spezifischen Cod...
MyISAM, eine häufig verwendete Speicher-Engine in...
Inhaltsverzeichnis Vorwort 1. Die Bedeutung der K...
1 QPS-Berechnung (Anzahl der Abfragen pro Sekunde...
Inhaltsverzeichnis Implementierungs-Effekt-Diagra...