So passen Sie Attribute in VueJS an

In vuejs können Sie die Anweisung „v-bind“ verwenden, um Attribute anzupassen. Die Syntax lautet „v-bind:custom attribute name="attribute value"; „v- Die Abkürzung des Befehls „bind“ lautet „:attribute name="attribute value"“, um Attribute anzupassen.

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

So fügen Sie benutzerdefinierte Attribute zu Elementen in Vuejs hinzu

Es gibt ein Szenario: v-for rendert eine Liste mit 10 Unterelementen und fügt den Elementen nach dem 5. Unterelement ein Attribut data-wow-delay=' hinzu -item 0.8s‘, die Implementierung ist wie folgt:

...<ul>
    <li v-for=&#39;(item,index) in [1,2,3,4,5,6,7,8,9,10]&#39; 
        :data-wow-delay="index>5?&#39;0.8s&#39;:&#39;&#39;">{{item}}</li></ul>...

Sie können sich eine Methode zum Hinzufügen benutzerdefinierter Attribute zu Elementen ausdenken

<el v-bind:自定义属性名="Boolean?&#39;value1&#39;:&#39;value2&#39;"></el>

Natürlich, wenn Sie nur ein gemeinsames Attribut (CSS-Attribut) wie Klasse hinzufügen, Stil usw. kann auch die folgende Methode verwendet werden.

<el v-bind:class="{&#39;aniamted&#39;:showAnimated}"></el>

Erklärung: v-bind-Anweisung

v-bind wird hauptsächlich für die Attributbindung verwendet. Vue stellt offiziell eine Abkürzung zur Verfügung: bind, zum Beispiel:

<!-- 完整语法 -->
v-bind:属性名="值"
<!-- 缩写 -->
:属性名="值"

Verwandte Empfehlungen: „vue.js-Tutorial“

Das obige ist der detaillierte Inhalt vonSo passen Sie Attribute in VueJS an. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!