Vue.js негізінен қолданбаның визуализация бөлігіне баса назар аударады, оны алдыңғы қатарлы әзірлеу деп те атайды. Vue.js күннен күнге танымал болып келеді, себебі ол басқа жобалармен және кітапханалармен біріктіру өте оңай. Оны орнату және пайдалану өте қарапайым.
Vue.js прогрессивті JavaScript құрылымы болып табылады ашық бастапқы интерактивті веб-пайдаланушы интерфейстерін және бір беттік қолданбаларды (SPA) әзірлеу үшін қолданылады. Vue.js әдетте Vue деп аталады және "view.js" немесе "көрініс" деп айтылады.
Бір беттік қолданба немесе SPA – бұл пайдаланушыларға жұмыс үстелі қолданбасына ұқсас өте тегіс, жауап беретін және жылдам тәжірибе беретін веб-бағдарлама немесе веб-сайт. Бір беттік қолданба бір беттегі мәзірді, түймелерді және блоктарды қамтиды. Пайдаланушы олардың біреуін басқанда, ол серверден жаңа беттерді жүктеудің орнына ағымдағы бетті динамикалық түрде қайта жазады. Бұл оның жауап беру жылдамдығының себебі.
Vue негізінен фронтенді әзірлеуге арналған, сондықтан ол көптеген HTML, JavaScript және CSS файлдарын өңдеуі керек. Vue.js пайдаланушыларға HTML-ді директивалар деп аталатын HTML атрибуттарымен кеңейтуді жеңілдетеді. Vue.js кірістірілген директиваларды және көптеген директиваларды қамтамасыз етеді defiHTML қолданбаларының функционалдығын жақсарту үшін пайдаланушының nite.
Төменде Vue.js ең маңызды мүмкіндіктерінің тізімі берілген:
Vue.js құрамдастары осы құрылымның маңызды ерекшеліктерінің бірі болып табылады. Олар қайта пайдалануға болатын кодты инкапсуляциялау үшін негізгі HTML элементтерін кеңейту үшін пайдаланылады. Vue.js қолданбаларында кейінірек HTML тілінде қайта пайдалануға болатын қайта пайдалануға болатын реттелетін элементтерді жасауға болады.
Vue.js көрсетілген DOM файлын Vue данасы деректерімен байланыстыру үшін пайдалануға болатын HTML негізіндегі үлгілерді қамтамасыз етеді. Барлық Vue үлгілері жарамды HTML болып табылады, оларды арнайы талаптарға сай браузерлер мен HTML талдаушылары талдай алады. Vue.js үлгілерді виртуалды DOM көрсету функцияларына құрастырады. Vue браузерді жаңарту алдында құрамдастарды виртуалды DOM жадына береді. Vue сонымен қатар қайта көрсету үшін құрамдастардың ең аз санын есептей алады және қолданба күйін өзгерткен кезде DOM манипуляциясының ең аз мөлшерін қолдана алады.
Vue қарапайым JavaScript нысандарын пайдаланатын және қайта көрсетуді оңтайландыратын жауап беру жүйесін ұсынады. Бұл процесте әрбір компонент өзінің реактивті тәуелділіктерін қадағалайды, сондықтан жүйе қашан және қай құрамдастарды қайта көрсету керектігін нақты біледі.
Беттерді шарлау vue-маршрутизатордың көмегімен жүзеге асырылады. Жалғыз бет қолданбасы үшін ресми түрде қолдау көрсетілетін vue-роутер кітапханасын пайдалануға болады.
Vue элементтері DOM ішінен енгізілген, жаңартылған немесе жойылған кезде әртүрлі өту әсерлерін пайдалануға мүмкіндік береді.
Vue.js пайдаланудың бірнеше әдістері бар. Оны ресми сайтына өту арқылы орнатуға болады немесе CDN кітапханасынан Vue.js файлын пайдалануды бастауға болады. Мұнда жобаңызда Vue.js пайдаланудың кейбір жолдары берілген.
Тегті пайдаланғыңыз келсе <script> Vue.js файлын тікелей HTML файлыңызға енгізсеңіз, оны ресми веб-сайттан жүктеп алуыңыз керек.
<html>
<head>
<script type = "text/javascript" src = "vue.min.js"></script>
</head>
<body>
</body>
</html> Vue.js ресми веб-сайтына барайық https://vuejs.org/v2/guide/installation.html қажеттіліктеріңізге сәйкес vue.js жүктеп алу үшін.
Сондай-ақ CDN файлынан Vue.js файлын қолданбаңызда пайдалануға болады. Элемент ішіндегі https://unpkg.com/vue@3/dist/vue.global.js сілтемесін пайдаланыңыз. <script>, төмендегідей:
<script src="https://unpkg.com/vue@3/dist/vue.global.js"></script>Vue.js - веб-әзірлеу және Single Page Applications (SPA) құру үшін кеңінен қолданылатын соңғы бағдарламалық қамтамасыз ету технологияларының бірі. Атауынан болжауға болатындай, ол көбінесе UI немесе жобаның дисплей жағы үшін қолданылады.
Жобаңызда Vue.js пайдаланудың артықшылықтарын көрейік:
Vue.js-тің ең үлкен артықшылықтарының бірі - оның өлшемі өте кішкентай. JavaScript құрылымының сәттілігі оның өлшеміне байланысты және бұл қызықты JavaScript плагині небәрі 18-21 КБ құрайды, сондықтан оны тез арада оңай жүктеп алып, пайдалануға болады.
Vue.js құрылымы өте қарапайым және оны түсіну өте оңай. Бұл осы шеңбердің танымалдылығының себептерінің бірі. HTML және JavaScript-пен таныс болсаңыз, Vue.js файлында оңай кодтауға болады. Пайдаланушылар Vue.js файлын қарапайым құрылымының арқасында веб-жобасына оңай қосып, қолданбаларды жасай алады.
Vue.js барлығына арналған көптеген құрамдастарға ие және оны бар қолданбалармен өте жылдам біріктіруге болады. Сіз оны JavaScript тілінде жазылған кез келген қолданбамен біріктіре аласыз.
Vue.js икемді табиғаты сонымен қатар React.js, Angular.js және кез келген басқа жаңа JavaScript фреймворктерін әзірлеушілерге түсінуді жеңілдетеді. Ол HTML файлдарын, JavaScript файлдарын және таза JavaScript файлдарын жазу үшін виртуалды түйіндерді пайдаланудың көптеген икемділігін қамтамасыз етеді.
Vue.js қолданбаларында қайта пайдалануға болатын реттелетін элементтерді жасауға болады.
Vue.js өте қарапайым, толық және егжей-тегжейлі құжаттаманы қамтамасыз етеді, сондықтан HTML және JavaScript туралы аз түсінігі бар әзірлеушілер оны бағдарламалау үшін пайдалана алады.
Vue.js виртуалды DOM қолданады, мысалы, ReactJS, Ember және т.б. бар. Виртуалды DOM - бастапқы HTML DOM-тың жеңіл жадтағы ағаш көрінісі және бастапқы DOM-ға әсер етпестен жаңартылады.
Vue.js HTML блоктарын өңдеуді жеңілдететін өзінің Үлгіні қарау үлгісі (MVVM) архитектурасымен екі жақты байланысты қамтамасыз етеді.
Фреймворк қарапайым және қарапайым үлгі синтаксисін қолдана отырып, деректерді DOM-ге декларациялық түрде көрсетуге мүмкіндік беретін жүйемен бірге келеді.
Міне, мысал:
<body>
<div id="app">
{{ message }}
</div>
<script>
var app = new Vue({
el: '#app',
data: {
message: 'This is a simple Vue.js Declarative Rendering example!'
}
})
</script>
</body>Vue.js жүйесі бізге мүмкіндік береді defiHTML қолданбаларының функционалдығын қамтамасыз ету үшін пайдаланылатын директивалар деп аталатын nire HTML атрибуттары.
Vue.js ішінде директиваның екі түрі бар:
Vue.js деректер үшін толтырғыштар ретінде қос жақшаларды {{}} пайдаланады, ал Vue.js директивалары - v префиксін пайдаланатын HTML төлсипаттары.
Vue қолданбасы бір DOM элементіне қосылып, оны толығымен басқарады. Жоғарыдағы мысалда бұл #app.
Vue көмегімен біз HTML-ді кіру нүктесі ретінде қарастыра аламыз, қалғанының бәрі жасалған Vue данасында болады.
Элементті және төлсипатты байланыстыруды қолданатын мысалды көрейік:
<html>
<head>
<link rel="stylesheet" href="index.css">
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
</head>
<body>
<div id="app-2">
<span v-bind:title="message">
Hover mouse over me for a few seconds
and see a dynamically bound title which I have set!
</span>
</div>
<script>
var app2 = new Vue({
el: '#app-2',
data: {
message: 'You loaded this page on ' + new Date().toLocaleString()
}
})
</script>
</body>
</html> Бұл жағдайда жаңа v-bind атрибуты директива болып табылады. Директивалар олардың Vue ұсынған бірегей атрибуттар екенін көрсету үшін v- префиксімен пайдаланылады және көрсетілген DOM-ға арнайы жауап беру әрекетін қолдану үшін пайдаланылады.
Мысалдың нәтижесі келесідей
Ercole Palmeri
Veeam ұсынған Coveware кибербопсалау оқиғаларына жауап беру қызметтерін көрсетуді жалғастырады. Coveware криминалистикалық және қалпына келтіру мүмкіндіктерін ұсынады ...
Болжалды техникалық қызмет көрсету зауытты басқаруға инновациялық және белсенді көзқараспен мұнай және газ секторында төңкеріс жасайды.…
Ұлыбританияның CMA жасанды интеллект нарығындағы Big Tech әрекеті туралы ескерту жасады. Ана жерде…
Ғимараттардың энергия тиімділігін арттыру үшін Еуропалық Одақ тұжырымдаған «Жасыл үйлер» жарлығы өзінің заң шығару процесін аяқтады ...
