Element Plus Tabellenkomponente MAX-Höhe ist ungültig? Wie mache ich die Tabelle sehr anpassungsfähig und zeigt Bildlaufleisten an?

Element Plus Table Component Max-Höhe-Attributausfall und Lösung

Während des Entwicklungsprozesses unter Verwendung von Element Plus begegnen wir häufig auf die Notwendigkeit der Tabellenhöhe, sich dynamisch entsprechend dem Inhalt zu ändern, können jedoch nicht unendlich verlängert werden. Im Idealfall sollte die Tabellenhöhe wachsen, wenn der Inhalt wächst, bis er 100% des übergeordneten Elements erreicht, und eine Scroll -Leiste scheint den Inhalt über den Abschnitt hinaus anzuzeigen. Das Einstellen der MAX-Höhe: 100% direkt für die EL-Table-Komponente erreicht häufig den erwarteten Effekt nicht. Obwohl die Tabellenhöhe 100% des übergeordneten Elements erreicht, kann die Bildlaufleiste nicht normal angezeigt werden.

Der grundlegende Grund für dieses Problem ist, dass die el-table-Komponente selbst stark computerisiert ist. Die MAX-Height-Eigenschaft wirkt sich auf eine bestimmte anfängliche Höhe aus, und wenn der Inhalt nicht vollständig geladen ist oder sich die Inhaltshöhe ändert

Um dieses Problem zu lösen, können wir die folgenden zwei Methoden mitnehmen:

Die erste Methode besteht darin, sicherzustellen, dass die el-table-Komponente einen bestimmten Höhenwert hat. Dies kann erreicht werden, indem die Höhe der Höhe direkt festgelegt wird, z. B. Höhe: 500px oder Höhe: Calc (100VH - 100px). Der Nachteil dieser Methode besteht darin, dass die ideale Höhe der Tabelle im Voraus bekannt oder berechnet werden muss und nicht flexibel genug ist.

Die zweite Methode ist flexibler, hört die Höhenänderungen des übergeordneten Elements an und weist der EL-Table-Komponente die Höhe des übergeordneten Elements dynamisch zu. Die spezifische Implementierungsmethode erfordert die Verwendung von JavaScript, um das Ereignis des übergeordneten Elements des übergeordneten Elements oder die Verwendung anderer reaktionsschneller Layout -Techniken anzuhören. Auf diese Weise stimmt die Höhe der EL-Table-Komponente immer mit der Höhe des übergeordneten Elements überein und erreicht so den Effekt von max-Höhe: 100%. Auch wenn die Inhaltshöhe die Höhe des übergeordneten Elements überschreitet, kann die Bildlaufleiste normal angezeigt werden. Diese Methode kann die Tabellenhöhe entsprechend der Größe des übergeordneten Elements adaptiv anpassen, was eher den Anforderungen dynamischer Inhalteänderungen entspricht.

Das obige ist der detaillierte Inhalt vonElement Plus Tabellenkomponente MAX-Höhe ist ungültig? Wie mache ich die Tabelle sehr anpassungsfähig und zeigt Bildlaufleisten an?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!