From Wikipedia, the free encyclopedia
Vue.js, JavaScript ֆրեյմորք բաց ներքին կոդով, որը նախատեսված է օգտատիրոջ միջերես մշակելու համար[7]։ Հեշտ է ինտեգրվում է նախագծերում, որոնք օգտագործում են այլ JavaScript գրադարաններ։ Սա կարող է աշխատել, ինչպես վեբ-ֆրեյմորք մեկ էջանոց հավելվածների մշակման համար։
Տեսակ | ազատ ծրագրային ապահովում, ծրագրային գրադարան, JavaScript framework?, վեբ ծրագրի հենք և ՋավաՍկրիպտ գրադարան |
---|---|
Հեղինակ | Evan You?[1][2][3] |
Գրված է՝ | ՋավաՍկրիպտ[4] և TypeScript |
ՕՀ | բազմապլատֆորմ |
Լույս տեսավ՝ | փետրվար 2014[5] |
Արտոնագիր | MIT արտոնագիր[6] |
Կայք | vuejs.org(անգլ.) |
Ելակոդ | github.com/vuejs/core |
Vue.js Վիքիպահեստում |
2013 թվականին Google աշխատակիցներից Էվան Յուն, աշխատում էր նախագծերից մեկի վրա, եկավ այն եզրահանգման, որ չկան պատրաստի լուծումներ վեբ հավելվածների բարդ միջերեսի արագ մշակման համար․ այս շրջանում React-ը դեռ գտնվում էր մշակման վաղ շրջանում, հիմնական գործիքները բարդ ֆրեյմորքերն էին, ինչպիսին է AngularJS կամ Backbone.js-ը։ Այս խնդրի լուծման համար Յուն սկսեց Vue.js-ի մշակումը, որը պահպանելով պարզությունը, ոչ միայն օգտակար եղավ պրոտոտիպերի հետ աշխատելու համար, այլև ամբողջական մշակման համար[8]։
2015 թվականի հոկտեմբերին թողարկվեց գրադարանի 1․0 տարբերակը, իկ արդեն 2016 թվականի սեպտեմբերին 2․0 տարբերակը։
Vue.js-ը օժտված է աստիճանաբար ադապտացվող ճարտարապետություն։ Հիմանական գրադարնը կենտրոնացված է միայն դիտման շերտի վրա[9]։ Ֆունկցիաների ընդլայնման համար անհրաժեշտ է պաշտոնապես աջակցվող գրադարանների աջակցում և փաթեթներ ինչպիսին է՝ Nuxt.js-ը, որը համարվում է ամենահայտի լուծումը[10]։
Vue.js-ը թույլ է ընդլայնել HTML կոդը, HTML ատրիբուտնների միջոցով[11]։
Vue.component('button-clicked', {
props: [ "initialCount" ],
data: () => ({
count: 0,
}),
te mplate: `<button v-on:click="onClick">Clicked {{ count }} times</button>`,
computed: {
countTimesTwo() {
return this.count * 2;
}
},
watch: {
count(newValue, oldValue) {
console.log(`The value of count is changed from ${oldValue} to ${newValue}.`);
}
},
methods: {
onClick() {
this.count += 1;
}
},
mounted() {
this.count = this.initialCount;
}
});
new Vue({ el: '#tuto', });