I-Vue.js igxile kakhulu engxenyeni yokuboniswa yohlelo, ebizwa nangokuthi ukuthuthukiswa kwesiphetho. I-Vue.js ithola ukuduma usuku nosuku ngoba kulula kakhulu ukuyihlanganisa namanye amaphrojekthi namalabhulali. Kulula kakhulu ukufaka nokusebenzisa.
I-Vue.js iwuhlaka lwe-JavaScript oluqhubekayo umthombo ovulekile esetshenziselwa ukuthuthukisa ukuxhumana komsebenzisi wewebhu okusebenzisanayo kanye nezinhlelo zokusebenza zekhasi elilodwa (ama-SPA). I-Vue.js ijwayele ukubizwa ngokuthi i-Vue futhi ibizwe ngokuthi "view.js" noma "buka".
Isicelo Sekhasi Elilodwa noma i-SPA wuhlelo lwewebhu noma iwebhusayithi enikeza abasebenzisi ulwazi olubushelelezi, oluphendulayo kanye nolusheshayo olufana nohlelo lokusebenza lwedeskithophu. Uhlelo lokusebenza lwekhasi elilodwa luqukethe imenyu, izinkinobho namabhulokhi ekhasini elilodwa. Uma umsebenzisi achofoza eyodwa yazo, ibhala kabusha ikhasi lamanje kunokulayisha amakhasi amasha aphelele asuka kuseva. Lesi yisizathu ngemuva kwejubane layo lokuphendula.
I-Vue yakhelwe ukuthuthukiswa kwe-frontend, ngakho-ke kufanele iphathe amafayela amaningi e-HTML, JavaScript kanye ne-CSS. I-Vue.js yenza kube lula kubasebenzisi ukunweba i-HTML ngezibaluli ze-HTML ezibizwa ngokuthi iziqondiso. I-Vue.js inikeza iziqondiso ezakhelwe ngaphakathi neziqondiso eziningi definite ngumsebenzisi ukuthuthukisa ukusebenza kwezinhlelo zokusebenza ze-HTML.
Ngezansi uhlu lwezici ezibaluleke kakhulu ze-Vue.js:
Izingxenye ze-Vue.js zingenye yezici ezibalulekile zalolu hlaka. Zisetshenziselwa ukunweba izinto eziyisisekelo ze-HTML ukuze zihlanganise ikhodi esebenziseka kabusha. Ungakha izici ngokwezifiso ezisebenziseka kabusha ezinhlelweni ze-Vue.js ezingaphinde zisetshenziswe ku-HTML.
I-Vue.js inikeza izifanekiso ezisekelwe ku-HTML ezingasetshenziswa ukuhlobanisa i-DOM enikeziwe nedatha yesibonelo se-Vue. Zonke izifanekiso ze-Vue ziyi-HTML evumelekile engacutshungulwa iziphequluli ezithobela imithetho ethile kanye nabahlaluli be-HTML. I-Vue.js ihlanganisa amamodeli abe imisebenzi yokunikezela ye-Virtual DOM. I-Vue inikela izingxenye kumemori ye-DOM ebonakalayo ngaphambi kokuvuselela isiphequluli. I-Vue ingase futhi ibale inombolo encane yezingxenye ezizonikezwa kabusha futhi isebenzise inani elincane lokukhohlisa kwe-DOM lapho kushintsha isimo sohlelo lokusebenza.
I-Vue inikeza isistimu yokusabela esebenzisa izinto ezilula ze-JavaScript futhi ithuthukise ukuphinda kunikezelwe. Kule nqubo, ingxenye ngayinye ilandelela ukuncika kwayo okusebenzayo, ngakho isistimu yazi kahle ukuthi iziphi izingxenye okufanele ziphinde zinikezwe nini futhi nini.
Ukuzulazula kwekhasi kwenziwa ngosizo lwe-vue-router. Ungasebenzisa ilabhulali ye-vue-router esekelwa ngokusemthethweni kuhlelo lwakho lokusebenza lwekhasi elilodwa.
I-Vue ikuvumela ukuthi usebenzise imiphumela ehlukile yoshintsho lapho izakhi zifakiwe, zibuyekezwa noma zikhishwa ku-DOM.
Kunezindlela ezimbalwa zokusebenzisa i-Vue.js. Ungayifaka ngokuya kusayithi yayo esemthethweni noma ungaqala ukusebenzisa ifayela le-Vue.js elisuka kulabhulali ye-CDN. Nazi ezinye izindlela zokusebenzisa i-Vue.js kuphrojekthi yakho.
Uma ufuna ukusebenzisa ithegi <script>
ye-Vue.js ngqo kufayela lakho le-HTML, udinga ukuyilanda kuwebhusayithi esemthethweni.
<html>
<head>
<script type = "text/javascript" src = "vue.min.js"></script>
</head>
<body>
</body>
</html>
Ake siye kuwebhusayithi esemthethweni ye-Vue.js https://vuejs.org/v2/guide/installation.html ukulanda i-vue.js ngokwezidingo zakho.
Ungasebenzisa futhi ifayela le-Vue.js elivela ku-CDN, ohlelweni lwakho lokusebenza. Sebenzisa isixhumanisi https://unpkg.com/vue@3/dist/vue.global.js ngaphakathi kwe-elementi <script>
, njengoba ngezansi:
<script src="https://unpkg.com/vue@3/dist/vue.global.js"></script>
I-Vue.js ingobunye bobuchwepheshe besofthiwe bakamuva obusetshenziswa kabanzi ekuthuthukisweni kwewebhu kanye nokwakha Izicelo Zekhasi Elilodwa (SPA). Njengoba ungaqagela egameni, lisetshenziselwa kakhulu i-UI noma uhlangothi lokubonisa lwephrojekthi.
Ake sibone izinzuzo zokusebenzisa i-Vue.js kuphrojekthi yakho:
Enye yezinzuzo ezinkulu ze-Vue.js ukuthi incane kakhulu ngosayizi. Ukuphumelela kohlaka lwe-JavaScript kuncike kakhulu kusayizi walo futhi le plugin ye-JavaScript ethokozisayo ingu-18-21KB kuphela, ngakho-ke ungayilanda kalula futhi uyisebenzise ngokushesha.
Uhlaka lwe-Vue.js lunesakhiwo esilula kakhulu futhi kulula ukuluqonda. Kungesinye sezizathu zokuduma kwalolu hlaka. Uma ujwayele i-HTML ne-JavaScript, ungakwazi ukufaka ikhodi kalula ku-Vue.js. Abasebenzisi bangangeza kalula ama-Vue.js kuphrojekthi yabo yewebhu ngenxa yesakhiwo sayo esilula futhi bathuthukise izinhlelo zokusebenza.
I-Vue.js inezingxenye eziningi zayo yonke into futhi ingahlanganiswa ngokushesha nezinhlelo ezikhona. Ungayihlanganisa nanoma yiluphi uhlelo lokusebenza olubhalwe ku-JavaScript.
Ukuvumelana nezimo kwe-Vue.js futhi kwenza kube lula ngonjiniyela be-React.js, Angular.js, kanye nanoma yiziphi ezinye izinhlaka ze-JavaScript ezintsha ukuthi baziqonde. Inikeza ukuguquguquka okuningi kokusebenzisa ama-node abonakalayo ukuze ubhale amafayela e-HTML, amafayela e-JavaScript namafayela e-JavaScript ahlanzekile.
Ungakha izici ezingokwezifiso ezisebenziseka kabusha ezinhlelweni ze-Vue.js.
I-Vue.js ihlinzeka ngemibhalo elula kakhulu, ephelele futhi enemininingwane, ngakho onjiniyela abangenalwazi olutheni nge-HTML ne-JavaScript bangayisebenzisa ukuhlela.
I-Vue.js isebenzisa i-DOM ebonakalayo efana nezinye izinhlaka ezikhona njenge-ReactJS, i-Ember, njll. I-DOM ebonakalayo iwumfanekiso wesihlahla ongasindi enkumbulweni we-HTML DOM yasekuqaleni futhi ibuyekezwa ngaphandle kokuthinta i-DOM yokuqala.
I-Vue.js inikeza ukuxhumana okubili ngesakhiwo sayo se-Model View View Model (MVVM) esenza kube lula ukuphathwa kwamabhulokhi e-HTML.
Uhlaka luza nohlelo olusivumela ukuthi sinikeze idatha ngokudalula ku-DOM sisebenzisa i-syntax yemodeli elula neqondile.
Nasi isibonelo:
<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>
Uhlaka lwe-Vue.js luyasivumela ukuthi defiizici ezingenalutho ze-HTML ezibizwa ngokuthi iziqondiso, ezisetshenziselwa ukunikeza ukusebenza kuzinhlelo zokusebenza ze-HTML.
Kunezinhlobo ezimbili zeziqondiso ku-Vue.js:
I-Vue.js isebenzisa izikaki ezikabili {{}} njengezimeli zedatha, futhi iziqondiso ze-Vue.js ziyizibaluli ze-HTML ezisebenzisa isiqalo se-v.
Uhlelo lokusebenza lwe-Vue luxhuma kwinto eyodwa ye-DOM futhi luyilawule ngokugcwele. Esibonelweni esingenhla, yi-#app.
Nge-Vue singabheka i-HTML njengendawo yokungena, futhi konke okunye kwenzeka ngaphakathi kwesibonelo se-Vue esidaliwe.
Ake sibone isibonelo lapho sizama khona isici nesibaluli ukubopha:
<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>
Kulokhu, isibaluli esisha se-v-bind siwumyalelo. Iziqondiso zisetshenziswa nesiqalo esingu-v ukuze kuboniswe ukuthi izibaluli ezihlukile ezinikezwe i-Vue, futhi zisetshenziselwa ukusebenzisa ukuziphatha okukhethekile kokuphendula ku-DOM enikeziwe.
Umphumela wesibonelo ulandelayo
Ercole Palmeri
I-Coveware ye-Veeam izoqhubeka nokuhlinzeka ngezinsizakalo zokuphendula izigameko zokuntshontshwa kwe-inthanethi. I-Coveware izohlinzeka ngama-forensics kanye nekhono lokulungisa…
Ukulungiswa okuqagelayo kuguqula umkhakha kawoyela negesi, ngendlela emisha nesebenzayo yokuphatha izitshalo.…
I-CMA yase-UK ikhiphe isexwayiso mayelana nokuziphatha kwe-Big Tech emakethe yezobunhloli bokwenziwa. Lapho…
Isinqumo esithi "Case Green", esakhiwe yi-European Union ukuze kuthuthukiswe ukusebenza kahle kwamandla ezakhiwo, siphothule inqubo yaso yomthetho ngokuthi...