Vue фреймворкийн ээлжит хичээлээр форм дээрх тоон утгын талбаруудад v-model директивийг яаж ашиглахыг үзье. Жишээ нь форм дээрээс хэрэглэгчийн насыг авах хэрэгтэй болсон гэе. Үүний тулд
<template>
<div>
<h2>Form inputs</h2>
<input type="text" v-model="age">
<hr>
<p>{{ age }}</p>
</div>
</template>
<script>
export default {
data () {
return {
age: 20
}
}
}
</script>код байхад болох мэт.
Материалыг бүртгэлтэй хэрэглэгч үзнэ.
how_to_regБүртгүүлэхМэдээлэл таалагдсан бол найзуудтайгаа хуваалцаарай.
Нээгдсэн тоо: 1008 Төлбөртэй
Хэрэглэгч програмын өгөгдөлтэй харьцах ажиллагаа бол ямарч програмыг хувьд чухал хэсэг байдаг. Үүнийг голдуу формоор дамжин хийдэг. Иймээс энэ удаа VueJs -ээр төрөл бүрийн input элементүүдтэй хэрхэн ажиллахыг
<body>
<div id="app">
<input type="text">
</div>
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<script>
new Vue({
el: '#app',
data: {
}
})
</script>
</body>кодоор авч үзье. Кодод хэрэглэгчээс өгөгдөл авах input элемент div id="app" элементэд Vue -гийн хувийн инициализац хийсэн байгаа. Хуудсыг нээвэл ердийн input талбар л үзэгдэнэ. Тэгвэл input элементэд ямар нэгэн зүйлийг оруулахад түүнийг хуудасны шаблонд шууд харуулах асуудлыг шийдье.
Нээгдсэн тоо: 1369 Төлбөртэй
Хэрэглэгч талын хуудасны динамик, интерактив байдлыг хангахад түүний элементүүдийн харагдацыг тодорхой нөхцлөөр удирдаж байх нь их чухал. Иймээс энэ хичээлээр VueJs -ээр хуудас дээрх элементүүдийн харагдацыг удирдах аргуудтай танилцая.
<!DOCTYPE html>
<head>
<meta charset="utf-8">
<title>Vue JS</title>
</head>
<body>
<div id="app">
<h2>isVisible = True</h2>
</div>
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<script>
new Vue({
el: '#app',
data: {
isVisible: true
}
})
</script>
</body>
</html>Дээрх энгийн код хуудаст h2 гарчигаар isVisible = True текстийг л үзүүлнэ. Vue -гийн тохиргооны обьектын data талбарт зарлагдсан isVisible талбарыг ашиглааагүй байгаа.
Нээгдсэн тоо: 1033 Нийтийн
Хичээлээр RxJs сангийн талаар өмнөх хичээлүүдээр олон авсан мэдлэгээ бататган API контактад хандан хэрэглэгчийн мэдээллийг авах энгийн програмыг боловсруулах болно. Програмаас төрөл бүрийн хүсэлтийг илгээх боломжтой болгох зорилгоор төсөлдөө Jquery санг суулгая. Үүний тулд WebStorm текст засварлагчийн терминалыг нээгээд
npm i jquery командыг өгөөрэй.
Нээгдсэн тоо: 361 Бүртгүүлэх
Ямарч түвшингийн төсөлд ихэнх тохиолдолд өгөгдлийн сантай ажиллах хэрэгцээ гарч ирдэг. Иймээс Vuejs фреймворкоор өгөгдлийн сантай ажиллах суурь ойлголтыг сайн ойлгосон байх шаардлагатай. Бид Post обьектыг үүсгэх хичээлд өгөгдлийн санд бичлэг нэмэн оруулахыг сурсан бол энэ удаад vue-resource санг ашиглан өгөгдлийн сангаас мэдээлэл татан авахыг сурцгаая.
Задаргааны сүүлээсээ 3 дахь гишүүний бином коэффициент 45 бол 
задаргааны 6-р гишүүнийг ол.
Нээгдсэн тоо : 664
илэрхийллийг хялбарчил.