Rumah > hujung hadapan web > Soal Jawab bahagian hadapan > Bagaimana untuk menyesuaikan atribut dalam vuejs

Bagaimana untuk menyesuaikan atribut dalam vuejs

青灯夜游
Lepaskan: 2023-01-11 09:22:32
asal
6094 orang telah melayarinya

Dalam vuejs, anda boleh menggunakan arahan "v-bind" untuk menyesuaikan atribut. anda juga boleh Gunakan singkatan arahan "v-bind" ":property name="property value"" untuk menyesuaikan hartanah.

Bagaimana untuk menyesuaikan atribut dalam vuejs

Persekitaran pengendalian tutorial ini: sistem Windows 7, vue versi 2.9.6, komputer DELL G3.

Cara Vuejs menambah atribut tersuai pada elemen

Terdapat senario sedemikian: v-for memaparkan senarai dengan 10 sub-item dan meletakkan sub-item ke-5 selepas Tambah atribut data-wow-delay='0.8s' pada setiap elemen, dan pelaksanaannya adalah seperti berikut:

...<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>...
Salin selepas log masuk

Anda boleh mendapatkan kaedah menambah atribut tersuai pada elemen

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

Sudah tentu, jika anda hanya menambah atribut biasa (atribut css), seperti kelas, gaya, dll., kaedah berikut juga boleh digunakan.

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

Penjelasan: Arahan v-bind

v-bind digunakan terutamanya untuk pengikatan atribut secara rasminya menyediakan singkatan: bind, contohnya:

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

Pengesyoran berkaitan: "tutorial vue.js"

Atas ialah kandungan terperinci Bagaimana untuk menyesuaikan atribut dalam vuejs. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Label berkaitan:
sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan