So ändern Sie die Anzeige und das Ausblenden des aktuellen Elements in Vue

Im Folgenden werde ich Ihnen eine Implementierungsmethode zum Ändern der Anzeige, des Ausblendens oder des Status des aktuell ausgewählten Elements in Vue vorstellen. Sie hat einen guten Referenzwert und ich hoffe, dass sie für alle hilfreich ist.

In vue ist es nicht mehr wie bei jq, dom direkt zu bedienen. Wenn Sie auf das aktuell ausgewählte Element verweisen möchten, können Sie die Idee von jq nicht mehr verwenden:

Beim Zeigen auf einen Status wird nur der angezeigte Status ausgeblendet und andere Elemente bleiben unverändert. Wenn element-ui im ​​Projekt verwendet wird, wird der Vorgang einfacher.

v-if="(row.id == currentId&&row.auditState==0)?checkState:!checkState" @mouseover="statehidden(row.id)"

In js:

statehidden(id){
   this.currentId=id; 
  },

Die Idee dieser Methode ist: Wenn die Maus auf ein Element zeigt, ermitteln Sie die ID eines bestimmten Elements, speichern Sie sie in einer Variablen und steuern Sie die Schaltfläche zum Ein- und Ausblenden, da die ID des aktuellen Elements nur abgerufen werden kann Die Maus zeigt auf ein bestimmtes Element, sodass Sie row.id==currentId zur Beurteilung verwenden können, sodass Sie die Änderungen des aktuellen Elements leicht steuern können

Ich hoffe, das Obige ist das, was ich für alle zusammengestellt habe Es wird in Zukunft für alle hilfreich sein.

Verwandte Artikel:

Klicken Sie auf die Seitenzahl, um den Seiteninhalt beim Paging in vue.js zu ändern

In der vue2.0-Komponente So implementieren Sie Wertweitergabe und Kommunikation

Neue Funktionen der Webpack 4.0.0-Beta.0-Version (ausführliches Tutorial)

Das obige ist der detaillierte Inhalt vonSo ändern Sie die Anzeige und das Ausblenden des aktuellen Elements in Vue. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!