So fügen Sie CSS dynamisch in Vue hinzu

So fügen Sie CSS dynamisch in Vue hinzu: 1. Binden Sie dynamische Stile an Elemente mit der Syntax „

"; 2. Definieren Sie Daten im Datenobjekt; 3. Schreiben Sie Stile in CSS.

Die Betriebsumgebung dieses Tutorials: Windows 7-System, Vue-Version 2.9.6, Dell G3-Computer.

Schritt eins: Dynamische Stile an Elemente binden

1. Einen einzelnen Stil hinzufügen

<div class="addInvTitle" :class="lightBlue">

2. Schritt zwei: Datenobjekte in Daten definieren

<div id="addInvite" class="addInvite" :class="[addInviteHeight1, addInviteHeight2]">

Schritt drei: Im chinesischen CSS-Schreibstil

data: {
    addInviteHeight1: '', // 弹框的高度
    addInviteHeight2: '', // 弹框的高度
    lightBlue: 'lightBlue',  // lightBlue是css中定义的样式名
}

[Empfohlenes Lernen:

Javascript-Tutorial für Fortgeschrittene

]

Das obige ist der detaillierte Inhalt vonSo fügen Sie CSS dynamisch in Vue hinzu. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!