Vue.js bi giranî balê dikişîne ser beşa dîtbarî ya serîlêdanê, ku jê re pêşkeftina pêş-endê jî tê gotin. Vue.js roj bi roj populer dibe ji ber ku ew pir hêsan e ku meriv bi proje û pirtûkxaneyên din re bike yek. Sazkirin û bikaranîn pir hêsan e.
Vue.js çarçoveyek JavaScriptê ya pêşkeftî ye çavkaniya vekirî ji bo pêşdebirina navgînên bikarhênerê yên tevnerê yên înteraktîf û sepanên yek rûpelê (SPA) tê bikar anîn. Vue.js bi gelemperî wekî Vue tê binav kirin û wekî "view.js" an "view" tê bilêvkirin.
Serlêdanek Rûpelek Yekane an SPA serîlêdanek malperê an malperek e ku ezmûnek pir xweş, bersivdar û bilez a mîna serîlêdana sermaseyê ji bikarhêneran re peyda dike. Serlêdanek yek rûpelek menu, bişkok û blokan li ser yek rûpelê vedigire. Gava ku bikarhênerek li ser yek ji wan bitikîne, ew bi dînamîk rûpela heyî ji nû ve dinivîse ne ku rûpelên tevahî nû ji serverek bar bike. Sedema leza wê ya bersivdayînê ev e.
Vue bi bingehîn ji bo pêşkeftina pêşîn hatî çêkirin, ji ber vê yekê pêdivî ye ku ew gelek pelên HTML, JavaScript û CSS-ê bi rê ve bibe. Vue.js ji bikarhêneran re hêsan dike ku HTML-ê bi taybetmendiyên HTML-ê yên ku jê re rêbername têne gotin dirêj bikin. Vue.js rêwerzên çêkirî û gelek rêwerzan peyda dike definite ji hêla bikarhêner ve ku fonksiyona serîlêdanên HTML-ê baştir bike.
Li jêr navnîşa taybetmendiyên herî girîng ên Vue.js heye:
Pêkhateyên Vue.js yek ji taybetmendiyên girîng ên vê çarçoveyê ne. Ew ji bo dirêjkirina hêmanên bingehîn ên HTML-ê têne bikar anîn da ku koda ji nû ve bi kar bîne. Hûn dikarin di sepanên Vue.js de hêmanên xwerû yên ji nû ve bi kar bînin biafirînin ku paşê dikarin di HTML-ê de werin bikar anîn.
Vue.js şablonên HTML-ê peyda dike ku dikare were bikar anîn da ku DOM-ya hatî çêkirin bi daneyên mînaka Vue re têkildar bike. Hemî şablonên Vue HTML-ya derbasdar in ku dikarin ji hêla gerokên lihevhatî û parserên HTML-ê ve bêne pars kirin. Vue.js modelan di fonksiyonên pêşkêşkirina Virtual DOM de berhev dike. Vue berî ku gerokê nû bike, hêmanan di bîra DOM-a virtual de vedigire. Vue di heman demê de dikare hêjmara hindiktirîn pêkhateyan hesab bike ku ji nû ve were pêşkêş kirin û dema ku rewşa serîlêdanê diguhezîne mîqdara herî kêm a manipulasyona DOM-ê bicîh bîne.
Vue pergalek bersivdayînê peyda dike ku hêmanên JavaScript-ê yên hêsan bikar tîne û ji nû ve pêşkêşkirinê xweşbîn dike. Di vê pêvajoyê de, her pêkhatek girêdanên xwe yên reaktîf dişopîne, ji ber vê yekê pergal bi rastî dizane kengê û kîjan hêmanan ji nû ve pêşkêş bike.
Navîgasyon rûpel bi alîkariya vue-router pêk tê. Hûn dikarin ji bo serîlêdana rûpela xweya yekane pirtûkxaneya vue-router-a bi fermî piştgirî bikar bînin.
Vue dihêle hûn dema ku hêman ji DOM-ê têne danîn, nûvekirin an jêbirin, bandorên veguheztinê yên cihêreng bikar bînin.
Gelek awayên karanîna Vue.js hene. Hûn dikarin wê bi çûna ser malpera wê ya fermî saz bikin an jî hûn dikarin pelê Vue.js ji pirtûkxaneya CDN-ê jî dest pê bikin. Li vir çend away hene ku hûn di projeya xwe de Vue.js bikar bînin.
Heke hûn dixwazin tagê bikar bînin <script> ya Vue.js rasterast di pelê xweya HTML-ê de, divê hûn wê ji malpera fermî dakêşin.
<html>
<head>
<script type = "text/javascript" src = "vue.min.js"></script>
</head>
<body>
</body>
</html> Ka em biçin malpera fermî ya Vue.js https://vuejs.org/v2/guide/installation.html da ku vue.js li gorî hewcedariyên xwe dakêşin.
Her weha hûn dikarin pelê Vue.js ji CDN-ê, di serîlêdana xwe de bikar bînin. Girêdana https://unpkg.com/vue@3/dist/vue.global.js di hundurê hêmanê de bikar bînin <script>, wekî jêrîn:
<script src="https://unpkg.com/vue@3/dist/vue.global.js"></script>Vue.js yek ji teknolojiyên nermalava herî dawî ye ku bi berfirehî ji bo pêşkeftina malperê û avakirina Serlêdanên Yek Rûpel (SPA) tê bikar anîn. Wekî ku hûn ji navê xwe texmîn dikin, ew bi piranî ji bo UI an aliyek pêşandana projeyê tê bikar anîn.
Ka em feydeyên karanîna Vue.js di projeya xwe de bibînin:
Yek ji mezintirîn avantajên Vue.js ev e ku ew bi mezinahî pir piçûk e. Serkeftina çarçoveyek JavaScript pir bi mezinahiya wê ve girêdayî ye û ev pêveka balkêş a JavaScript tenê 18-21 KB ye, ji ber vê yekê hûn dikarin di demek kurt de bi hêsanî dakêşin û bikar bînin.
Çarçoveya Vue.js xwedan avahiyek pir hêsan e û pir hêsan tê fam kirin. Ew yek ji sedemên populerbûna vê çarçoveyê ye. Heke hûn bi HTML û JavaScriptê dizanin, hûn dikarin bi hêsanî di Vue.js de kod bikin. Bikarhêner dikarin bi hêsanî Vue.js ji ber avahiya wê ya hêsan li projeya xweya malperê zêde bikin û sepanan pêşve bibin.
Vue.js ji bo her tiştî gelek hêman hene û dikare pir zû bi sepanên heyî re were yek kirin. Hûn dikarin wê bi her serîlêdana ku di JavaScriptê de hatî nivîsandin yek bikin.
Xwezaya maqûl a Vue.js di heman demê de fêmkirina pêşdebirên React.js, Angular.js, û çarçoveyek din a JavaScript-a nû hêsan dike. Ew ji bo nivîsandina pelên HTML, pelên JavaScript û pelên JavaScript-ê yên safî pir nermbûnek bikar tîne.
Hûn dikarin hêmanên xwerû yên ku di sepanên Vue.js de ji nû ve têne bikar anîn biafirînin.
Vue.js belgeyên pir hêsan, bêkêmasî û hûrgulî peyda dike, ji ber vê yekê pêşdebirên ku di derheqê HTML û JavaScript-ê de kêm fikirîn dikarin wê ji bo bernamekirinê bikar bînin.
Vue.js DOM-a virtual mîna çarçoveyên heyî yên mîna ReactJS, Ember, hwd bikar tîne. DOM-ya virtual nûnerek dara bîranînê ya sivik a HTML DOM-a orjînal e û bêyî ku bandorê li DOM-a destpêkê bike tê nûve kirin.
Vue.js bi mîmariya xwe ya Model View View Model (MVVM) re danûstendina du-alî peyda dike ku karanîna blokên HTML-ê hêsan dike.
Çarçove bi pergalek tê ku destûrê dide me ku em bi karanîna hevoksaziya modela hêsan û rasterast daneyan bi eşkereyî bidin DOM-ê.
Li vir mînakek e:
<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>Çarçoveya Vue.js destûrê dide me defitaybetmendiyên HTML-ê yên ku jê re dîrektîv têne gotin, ku ji bo peydakirina fonksiyonên serîlêdanên HTML-ê têne bikar anîn.
Di Vue.js de du celeb rêwerz hene:
Vue.js ji bo daneyan du brakên {{}} wekî cîhgiran bikar tîne, û rêwerzên Vue.js taybetmendiyên HTML-ê ne ku pêşgirek v- bikar tînin.
Serlêdanek Vue bi yek elementek DOM-ê ve girêdide û wê bi tevahî kontrol dike. Di mînaka jorîn de, ew #app e.
Bi Vue re em dikarin HTML-ê wekî xala têketinê bihesibînin, û her tiştê din di hundurê mînaka Vue ya hatî afirandin de diqewime.
Ka em mînakek bibînin ku em li wir girêdana element û taybetmendiyê biceribînin:
<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> Di vê rewşê de, taybetmendiya nû ya v-bind rêwerz e. Rêvebir bi pêşgirek v-yê têne bikar anîn da ku destnîşan bikin ku ew taybetmendiyên bêhempa ne ku ji hêla Vue ve têne peyda kirin, û ji bo sepandina tevgerên bersivdar ên taybetî li DOM-a hatî çêkirin têne bikar anîn.
Encama nimûneyê li jêr e
Ercole Palmeri
Google DeepMind guhertoyek çêtir a modela xweya îstîxbarata sûnî destnîşan dike. Modela nû ya pêşkeftî ne tenê peyda dike…
Laravel, bi hevoksaziya xweşik û taybetmendiyên xwe yên hêzdar navdar e, di heman demê de bingehek zexm ji bo mîmariya modular peyda dike. Va…
Cisco û Splunk ji xerîdaran re dibin alîkar ku rêwîtiya xwe berbi Navenda Operasyonên Ewlekariyê (SOC) ya pêşerojê bi…
Ransomware di van du salên dawî de li ser nûçeyan serdest e. Pir kes baş dizanin ku êrîş…
Operasyonek ophthalmoplasty bi karanîna temaşekera bazirganî ya Apple Vision Pro li Polyclinic Catania hate kirin…
Pêşxistina jêhatîbûnên motorê yên xweş bi rêya rengînkirinê zarokan ji hunerên tevlihevtir ên mîna nivîsandinê re amade dike. Reng kirin…
Sektora deryayî hêzek aborî ya cîhanî ya rastîn e, ku ber bi bazarek 150 mîlyar ve çûye…
Duşemiya borî, Financial Times peymanek bi OpenAI re ragihand. FT destûr dide rojnamegeriya xwe ya cîhanî…
