Fan nomi: Web dasturlashga kirish Mavzu

Deklarativ ko'rsatish
Vue.js-ning asosiy qismi oddiy shablon sintaksisidan foydalanib DOM-ga ma'lumotlarni deklarativ ravishda taqdim etishga imkon beradi:

{{xabar}}

E'tibor bering, Vue.js qo'shaloq jingalak qavslar tomonidan e'lon qilingan bayonotni baholaydi, shuning uchun Vue misolidagi "ma'lumotlar" ob'ekti mag'lubiyat shabloniga o'tkaziladi. Shuning uchun ma'lumotlar ob'ekti va DOM bir-biriga bog'langan va endi hamma narsa reaktivdir. Buni JavaScript konsolimizni ochish va app.message-ni boshqa qiymatga o'rnatish orqali tasdiqlashimiz mumkin.

Direktivalar
Direktivalar - bu DOMni boshqarishimizga imkon beradigan v- prefiksli (v-if, v-else, v-show, v-bind va v-model kabi) maxsus atributlar . Masalan:

Siz Hello World yozuvini ko'rasiz.

Bu erda v-if shartli ko'rsatmasi, agar "ko'rsatilgan" ifodaning qiymati to'g'ri bo'lsa,
elementini olib tashlaydi yoki qo'shadi. Agar JavaScript konsolimizga app.shown = false-ni kiritsak, biz xabar yo'qolganini ko'rishimiz kerak. Shunday qilib, biz DOM tuzilishi uchun ma'lumotlarni bog'lashimiz mumkin.
Ba'zi ko'rsatmalar direktiv nomidan keyin ikki nuqta bilan belgilanadigan "argument" qabul qilishi mumkin. Masalan, v-bind direktivasi HTML atributini reaktiv ravishda yangilash uchun ishlatiladi. Quyida, "to'ldiruvchi" - bu "kutilgan qiymat" iborasi qiymatiga elementning "to'ldiruvchi" atributini bog'lash uchun v-bind direktivasini ko'rsatadigan argument.