Es gibt viele Möglichkeiten für el-tree, das Symbol auf der linken Seite anzupassen.
Die erste Methode: Rufen Sie die Diagrammklasse el-tree-node__expand-icon über die CSS-Klasse ab und ändern Sie dann das Symbol, indem Sie den Klassennamen festlegen und das CSS ändern Stil.
Der zweite Weg: Entfernen Sie das Element el-tree-node__expand-icon direkt über js und ersetzen Sie das DOM direkt.
Die beiden oben genannten Methoden sind relativ starr, die erste ist für Element-UI geeignet.
Der dritte Typ: Das offizielle Dokument von element-plus gibt an, dass das Symbol durch Konfigurieren des Symbols angepasst werden kann, bei dem es sich um eine Zeichenfolge oder eine Komponente handeln kann. Da es sich um eine Komponente handeln kann, bedeutet dies, dass die Skalierbarkeit relativ hoch ist. Sie können die Symbolkomponente in el-icon oder eine benutzerdefinierte Komponente verwenden. Wenn das El-Symbol die Anforderungen nicht erfüllt, können Sie selbst eine Komponente schreiben, Bilder oder Divs in der Komponente verwenden und die Komponente direkt in das Symbolattribut einfügen, um ein vollständig angepasstes Symbol zu erhalten.
Komponenten:
<template>
<img src="url" />
</template>
verwenden
<template>
<el-tree :icon="Component"></el-tree>
</template>
<script>
import Component from 'url'
</script>