Vue.js是一個(gè)構(gòu)建數(shù)據(jù)驅(qū)動(dòng)的 web 界面的漸進(jìn)式框架。Vue.js 的目標(biāo)是通過盡可能簡(jiǎn)單的 API 實(shí)現(xiàn)響應(yīng)的數(shù)據(jù)綁定和組合的視圖組件艺骂。核心是一個(gè)響應(yīng)的數(shù)據(jù)綁定系統(tǒng)诸老。
vue兩大特點(diǎn):
響應(yīng)式編程:響應(yīng)式編程是一套最核心的理念,整個(gè)系統(tǒng)根據(jù)數(shù)據(jù)對(duì)象對(duì)頁面進(jìn)行反向渲染钳恕,讓站點(diǎn)避免結(jié)構(gòu)混亂的問題
組件化:組件可以擴(kuò)展HTML元素别伏,封裝可重用的代碼。在較高層面上忧额,組件是自定義元素厘肮,Vue.js 的編譯器為它添加特殊功能。在有些情況下睦番,組件也可以表現(xiàn)為用?is特性進(jìn)行了擴(kuò)展的原生 HTML 元素类茂。
Vue的漸進(jìn)式框架:
漸進(jìn)式框架就是把框架分層最核心的部分是視圖渲染 然后是組件機(jī)制 路由機(jī)制 管理狀態(tài)?單元測(cè)試等。除了核心部分 其他部分可以按自己需求添加托嚣。
VUE的MVVM模式:
在前端最底層最基礎(chǔ)的結(jié)構(gòu)式:頁面結(jié)構(gòu)html 大咱、樣式css 、行為js 注益〔杲恚可以把頁面劃分成視圖(html,css)和邏輯層(js)
Vue將視圖層抽象為一個(gè)模板template 作為vue實(shí)例的template屬性值?模板中通過directice來建立視圖層view和viewModwl的聯(lián)系。
vue的優(yōu)勢(shì):輕量級(jí)框架丑搔、簡(jiǎn)單易學(xué)厦瓢、雙向數(shù)據(jù)綁定提揍、組件化、視圖煮仇、數(shù)據(jù)和結(jié)構(gòu)的分離劳跃、虛擬DOM、運(yùn)行速度快浙垫。vue是單頁面應(yīng)用刨仑,使頁面局部刷新,不用每次跳轉(zhuǎn)頁面都要請(qǐng)求所有數(shù)據(jù)和dom夹姥,這樣大大加快了訪問速度和提升用戶體驗(yàn)杉武。而且他的第三方ui庫很多節(jié)省開發(fā)時(shí)間。
vue與其他兩大框架react辙售、angular的優(yōu)缺點(diǎn)轻抱。
VUE:
[if !supportLists]1.?[endif]便于擴(kuò)展的插件系統(tǒng)。
[if !supportLists]2.?[endif]擁有在使用服務(wù)端渲染時(shí)的庫(Nuxt.js)旦部。
[if !supportLists]3.?[endif]支持范圍樣式祈搜。
[if !supportLists]4.?[endif]有一個(gè)CLI工具,允許你通過先進(jìn)的前端工作流設(shè)置士八,快速構(gòu)建單頁應(yīng)用容燕。
[if !supportLists]5.?[endif]被加入Laravel5.4的新特性中,用來處理前端模板
[if !supportLists]6.?[endif]易于學(xué)習(xí)和理解婚度,能快速開發(fā)應(yīng)用
[if !supportLists]7.?[endif]與Laravel集成缰趋,所以具有 Vue 知識(shí)的開發(fā)人員對(duì)使用 Laravel 開發(fā)應(yīng)用的后端團(tuán)隊(duì)有所補(bǔ)充
[if !supportLists]8.?[endif]擁有非常方便的CLI工具,可以快速啟動(dòng)
[if !supportLists]9.?[endif]有很多額外的模塊陕见,如路由器和狀態(tài)管理工具秘血;雖然不如其他框架那么多
[if !supportLists]10.?[endif]降低前端應(yīng)用成本,乃至全功能web應(yīng)用的成本(在使用 Laravel 和 Vue.js 的組合時(shí))
[if !supportLists]11.?[endif]在保證穩(wěn)定性的同時(shí)评甜,是一個(gè)快速可靠的解決方案
[if !supportLists]12.?[endif]較小的模塊很適用灰粮,如日歷,聯(lián)繫人表單或小部件
React:
[if !supportLists]13.?[endif]框架只負(fù)責(zé)「View」層忍坷,這意味著其它業(yè)務(wù)邏輯是完全解耦的粘舟,并且能以任何方式來實(shí)現(xiàn)。
[if !supportLists]14.?[endif]與框架相關(guān)的Redux是一個(gè)非常棒的類 Flux 架構(gòu)的實(shí)現(xiàn)佩研。
[if !supportLists]15.?[endif]模板方面柑肴,框架可以使用JSX語法,這個(gè)語法在剛上手時(shí)可能會(huì)有一點(diǎn)點(diǎn)難度旬薯。
[if !supportLists]16.?[endif]開發(fā)者掌握React.js的知識(shí)后晰骑,可以直接用于基于 React Native 的移動(dòng)客戶端開發(fā)。
[if !supportLists]17.?[endif]龐大且活躍的社區(qū)
[if !supportLists]18.?[endif]JSX這種新的 JavaScript 語法绊序,也是一個(gè)不錯(cuò)的優(yōu)點(diǎn)
[if !supportLists]19.?[endif]相關(guān)的開發(fā)工具也很不錯(cuò)
[if !supportLists]20.?[endif]強(qiáng)制使用最新的最佳實(shí)踐
[if !supportLists]21.?[endif]大量的開發(fā)者熟悉這個(gè)框架
[if !supportLists]22.?[endif]React Native使得 Web 應(yīng)用的邏輯可以復(fù)用于移動(dòng)客戶端
[if !supportLists]23.?[endif]有足夠多的使用和測(cè)試場(chǎng)景來保證框架本身幾乎沒有bug和錯(cuò)誤
[if !supportLists]24.?[endif]它提供了現(xiàn)代功能硕舆,您可以輕松地找到資源秽荞。
局限性:
? 并非一個(gè)大而全的框架
? 它不允許在項(xiàng)目生成時(shí)進(jìn)行任何配置,而Vue 支持?Yeoman-like定制抚官。
? 它只提供一個(gè)構(gòu)建單頁面應(yīng)用的單一模板扬跋,而Vue 提供了各種用途的模板。
? 它不能用用戶自建的模板構(gòu)建項(xiàng)目凌节,而自建模板對(duì)企業(yè)環(huán)境下預(yù)先建立協(xié)議是特別有用的钦听。
Angular:
特性:? 由TypeScript 編寫,允許開發(fā)人員使用 TypeScript倍奢,Dart 或純粹的 ECMAScript朴上。
? 組件的模式利用了TS 類和裝飾器。
? 陡峭的學(xué)習(xí)曲線
? 開發(fā)過程很快娱挨。
? 高級(jí)的的測(cè)試特性余指。
直接上干貨eScript就開心了
? 強(qiáng)制規(guī)定編寫代碼的方式捕犬,使得它成為與多個(gè)開發(fā)人員合作的好選擇
? 使用同一個(gè)庫開發(fā)移動(dòng)和桌面應(yīng)用
? 對(duì)于具有很多代碼的單頁應(yīng)用是個(gè)不錯(cuò)的解決方案
? 使用該框架構(gòu)建企業(yè)應(yīng)用可能會(huì)降低成本
? 大量開發(fā)人員已經(jīng)知道如何使用框架
? 提供了非常豐富且清晰的錯(cuò)誤消息跷坝,實(shí)際上可以幫助開發(fā)人員解決問題。
由于在國內(nèi)開始流行vue框架碉碉,并且vue是中國大神尤雨溪開發(fā)的柴钻,在中國更加受到推崇。