vue前端項(xiàng)目組織

Jeff 發(fā)布于2019-08-23 18:12 / 901人閱讀

摘要：于是，可以大致得到一個(gè)前端項(xiàng)目的模型視圖層數(shù)據(jù)層業(yè)務(wù)視圖層負(fù)責(zé)渲染到界面的，比如，這樣的庫負(fù)責(zé)渲染到瀏覽器上，這樣的庫負(fù)責(zé)渲染到設(shè)備上。其核心是組件化。前端要做描述也許是一個(gè)更好的方式。

react是一個(gè)視圖層的框架（曾經(jīng)是，現(xiàn)在有了hook，已經(jīng)超越的視圖的范疇），vue借鑒了react的很多思想，所以也可以看做是一個(gè)視圖層的框架（雖然vue2.0宣稱自己是前端的一個(gè)漸進(jìn)式開發(fā)框架，但是這里簡單些看做是視圖的框架）。vue構(gòu)建了一個(gè)數(shù)據(jù)驅(qū)動(dòng)視圖的開發(fā)方式，讓復(fù)雜的邏輯轉(zhuǎn)化為對數(shù)據(jù)的邏輯，于是數(shù)據(jù)操作到了一定復(fù)雜的程度，就需要有數(shù)據(jù)狀態(tài)管理。我們可能需要用數(shù)據(jù)去描述一些業(yè)務(wù)的狀態(tài)，這樣才能將業(yè)務(wù)在技術(shù)上分塊，抽象。于是，可以大致得到一個(gè)前端項(xiàng)目的模型：

視圖層

數(shù)據(jù)層

業(yè)務(wù)

視圖層負(fù)責(zé)渲染到界面的，比如vue，react這樣的庫負(fù)責(zé)渲染到web瀏覽器上，UIKit這樣的庫負(fù)責(zé)渲染到ios設(shè)備上。其核心是組件化。數(shù)據(jù)層一般由vuex，redux這樣的庫來做，當(dāng)然也會(huì)有很多的局限性，這時(shí)也可以用node+graphQL做一個(gè)更強(qiáng)大的數(shù)據(jù)管理。業(yè)務(wù)的描述我記得是有許多語言模型，比如流程圖，UML，時(shí)序圖這些，在一些graphQL大會(huì)上還會(huì)聽到將DDD和graphQL融合起來的演講。前端要做描述DDD+graphQL也許是一個(gè)更好的方式。

下面來說一說vue組件化的一些實(shí)踐：
要做好組件化，可以考慮幾點(diǎn)：