1. 程式人生 > >vue入門 vue與react和Angular的關係和區別

vue入門 vue與react和Angular的關係和區別

一、為什麼學習vue.js

vue.js兼具angular.js和react的優點,並且剔除了他們的缺點。

二、vue.js是什麼

Vue是一個"MVVM框架(庫)",和angular類似,相比angular小巧,比較容易上手

Vue是一個構建使用者介面點的漸進式框架,與其他重量級框架不同的是,vue採用自底向上增量開發的設計

vue的核心庫"只關注檢視層",並且"非常容易學習",非常容易與其他庫或者已有的專案整合,另一方面,vue完全有能力驅動採用單檔案元件和vue生態系統支援的庫開發的複雜單頁面應用

vue的目標是通過儘可能簡單的API實現"響應的資料繫結"和"組合的檢視元件"

三、MVC/MVP/MVVM的區別

複雜的軟體必須有清晰合理的架構,否則無法開發和維護

MVC、MVP和MVVM否是用來解決介面呈現和邏輯程式碼分離而出現的模式

通俗的講:就是方便大多數人開發和維護出現的程式碼分離模式

四、MVC

檢視(view):使用者介面

控制器(controller):業務邏輯

模型(Model):資料處理

五、MVP

MVP 是從經典的模式MVC演變而來,它們的基本思想有相通的地方:Controller/Presenter負責邏輯的處理,Model提供資料,View負 責顯示。作為一種新的模式,MVP與MVC有著一個重大的區別:在MVP中View並不直接使用Model,它們之間的通訊是通過Presenter (MVC中的Controller)來進行的,所有的互動都發生在Presenter內部,而在MVC中View會從直接Model中讀取資料而不是通過 Controller。

六、MVVM

MVVM在概念上是真正將頁面與資料邏輯分離的模式,在開發方式上,它是真正將前臺程式碼開發者(JS+HTML)與後臺程式碼開發者分離的模式(asp,asp.net,php,jsp)

雙向繫結:view的變動,自動反映在viewModel,反之亦然

七、vue對比其他框架

1、vue-angular

1)、vue在設計之初參考了很多angular的思想

2)、vue相比於angular來說更加的簡單

3)、vue相當於angular要變得小巧很多,執行速度比angular快

4)、vue和angular繫結都可以用{{}}

5)、vue指令用v-xxx,angular用ng-xxx

6)、vue中資料放在data物件裡面,angular資料繫結在$scope上面

7)、vue有元件化概念,angular中沒有

2、vue-react

他們都有:

1)、react和vue都是用虛擬DOM Virtual DOM

2)、React和Vue都提供了響應式(Reactive)和元件化(Componsable)的檢視元件

3)、React和vue都將注意力集中保持在核心庫,伴隨於此,有配套的路由和負責處理全域性狀態管理的庫

4)、React使用JSX渲染頁面,Vue使用簡單的模板

5)、Vue比react執行更快