Vue學(xué)習(xí)日記（一）——Vue介紹

王晗發(fā)布于2019-08-26 11:33 / 1494人閱讀

摘要：的核心庫只關(guān)注視圖層，并且非常容易學(xué)習(xí)，非常容易與其它庫或已有項目整合。的目標(biāo)是通過盡可能簡單的實現(xiàn)響應(yīng)的數(shù)據(jù)綁定和組合的視圖組件。并不是框架，只是和他旁邊的生態(tài)環(huán)境組成了一個框架，下面，貼一個官方的漸進(jìn)式框架介紹圖吧，方便理解。

前言

本人學(xué)習(xí)了一段時間的vue，并嘗試寫了一些小Demo之后，將vue投入了幾個項目之后，一直在邊學(xué)習(xí)邊使用，經(jīng)過看了vue,vuex,vue-router的官方文檔和慕課網(wǎng)上的一些實戰(zhàn)視頻之后，深有體會，故此寫下這些文章。

前端框架比較

其實的話，前端有很多的框架，很多初學(xué)前端的人可能沒有接觸到框架，以為框架是很高大上的東西，就我個人而言，我是聽從師姐的學(xué)習(xí)路線開始學(xué)習(xí)前端的，一開始的時候接觸的就是html,css,js這些基本語言，對于框架，一直是覺得很高大上的東西。后來，經(jīng)過長時間的與框架打交道之后，也明白了，基礎(chǔ)對于前端開發(fā)者是很重要的，框架也就只是將你會復(fù)用的代碼進(jìn)行包裝起來方便你的使用，最重要的還是基礎(chǔ)。

目前前端開發(fā)有很多的框架在市面上，其實說是框架，如果從C語言java語言那些語言來說，也就是庫，一些封裝好的東西，告訴你用法，就可以簡單的實現(xiàn)一個簡單的項目了。如果想更加了解前端框架，建議可以百度百度，或者看這篇知乎討論，點擊里面的文章看看，引用一下這里的一張圖片展示一下目前的前端框架。

是的這只是部分前端框架，就我個人覺得，目前前端框架的三大巨頭也就只是
vue,react,angular（順序與排名無關(guān)）。

各個框架都有自己擅長的一方面：

vue擅長單頁面多路由的開發(fā)

react適合多頁面，手機app還有一些大型的開發(fā)

angular系統(tǒng)比較完善，適合快速搭建產(chǎn)品的原型

但是也各有各的劣勢：

vue并不特別適合多頁面的開發(fā)

react在單頁面開發(fā)性能并不比vue好，因為vue比較輕便

angular不適合程序員去自我發(fā)揮很多，因為其基本配置好餓了很多東西

當(dāng)然，以上也都只是個人的見解而已，有錯誤還望包涵指正，關(guān)于他們的社區(qū)，就不多做介紹了，三大框架社區(qū)都比較完善。

Vue的優(yōu)勢

Vue.js是一個輕巧、高性能、可組件化的MVVM庫，如果你不懂什么是mvvm模式可以看一下這篇文章個人覺得比較容易理解，同時擁有非常容易上手的API；

Vue.js是一個構(gòu)建數(shù)據(jù)驅(qū)動的Web界面的庫。

Vue.js是一套構(gòu)建用戶界面的漸進(jìn)式框架。與其他重量級框架不同的是，Vue 采用自底向上增量開發(fā)的設(shè)計。

Vue 的核心庫只關(guān)注視圖層，并且非常容易學(xué)習(xí)，非常容易與其它庫或已有項目整合。

另一方面，Vue 完全有能力驅(qū)動采用單文件組件和Vue生態(tài)系統(tǒng)支持的庫開發(fā)的復(fù)雜單頁應(yīng)用。

簡單的說，Vue.js是一個構(gòu)建數(shù)據(jù)驅(qū)動的 web 界面的漸進(jìn)式框架。Vue.js 的目標(biāo)是通過盡可能簡單的 API 實現(xiàn)響應(yīng)的數(shù)據(jù)綁定和組合的視圖組件。核心是一個響應(yīng)的數(shù)據(jù)綁定系統(tǒng)

Vue.js的特性如下：

輕量級的框架

雙向數(shù)據(jù)綁定

指令

插件化

Vue漸進(jìn)式框架

為什么說vue是漸進(jìn)式框架呢？

其實vue的官方首頁就說了，vue,漸進(jìn)式JavaScript 框架

其實嚴(yán)格的說，vue并不是一個框架，他只是一個庫，和jq一樣，可以操作dom的庫，不同的是vue操作的是虛擬dom，至于什么是虛擬dom我會在下篇文章繼續(xù)介紹。

vue并不是框架，只是和他旁邊的生態(tài)環(huán)境組成了一個框架，下面，貼一個官方的漸進(jìn)式框架介紹圖吧，方便理解。

正如上圖解釋，一個vue漸進(jìn)式框架就是由

聲明式渲染vue.js

組件系統(tǒng)element-ui（也可以用bootstrap等，但是建議還是用這個，因為其他的還要下載其他的dom庫）

客戶端路由vue-router

大型狀態(tài)管理vuex

構(gòu)建工具webpack

Vue全家桶

Vue著名的全家桶其實就是，包含了vue-router，vuex， vue-resource（現(xiàn)在基本不用，而是用更為簡單的axios）。再加上構(gòu)建工具vue-cli，就是一個完整的vue項目的核心構(gòu)成。

同時，在vue調(diào)試方面，可以選擇安裝chrome插件vue Devtools，以及有專門的組件庫elment-ui，輕輕松松就可以完成一個較大型的項目

總結(jié)

vue個人覺得是很不錯的框架，特別還是國內(nèi)牛人發(fā)布的，接下來還會有vue一系列的文章，以及vue+axios+mysql+node+express全棧實現(xiàn)一個系統(tǒng)的文章，去更加深入的了解vue。當(dāng)然還有更加深入的理解，大家也可以看看官方文檔，都介紹的很充分了。