必須通讀的文檔
擴(kuò)展功能
通過 @vue/composition 這個(gè)庫,它已經(jīng)以插件的形式在 2.x 中生效了,這一套 API 將內(nèi)建在 Vue 3.0 中,它將與現(xiàn)有的 2.x 選項(xiàng)同時(shí)可用。
一篇比較react hooks和vue composition API的文章:
對(duì)比 React Hooks 和 Vue Composition API
參考資料
快速上手企業(yè)級(jí)中后臺(tái)實(shí)例
使用Antd vue構(gòu)建的Pro案例:Github: ant-design-vue-pro
首先安裝vue cli
yarn global add @vue/cli
然后下載代碼庫
git clone --depth=1 https://github.com/vueComponent/ant-design-vue-pro.git vue-pro-starter
cd vue-pro-starter
啟動(dòng)
yarn serve
這時(shí)候就可以用瀏覽器訪問如下地址
http://localhost:8000/

寫給React開發(fā)者
vue更偏向傳統(tǒng)html/js開發(fā)模式;react更希望有優(yōu)雅的開發(fā)感受
vue傾向于官方力量發(fā)展,可用的基本都是官方發(fā)布的插件;react借助社區(qū)的力量發(fā)展,尤其是國內(nèi)大廠貢獻(xiàn)了非常好的組件(dva、umijs等)
Templatevsjsx,受限于傳統(tǒng)DOM,vue中各種PascalCase、camelCase和kebab-case的變化容易讓人感覺混淆,directive的使用也會(huì)比較費(fèi)勁,但如果開發(fā)者擁有足夠的想象力,的確能夠大大降低了代碼的復(fù)雜度;react的render函數(shù)相對(duì)來說要優(yōu)雅得多,但是比較拘謹(jǐn),解決方案中規(guī)中矩屬性,vue中的屬性分為data、props、computed和state,分別有各自相對(duì)獨(dú)立的定義方法和調(diào)用方式,可用于不同的應(yīng)用場(chǎng)景,同樣對(duì)于開發(fā)者來說,入手容易,進(jìn)階則比較困難;react的屬性包括props和state,其中props又可包含了上級(jí)組件導(dǎo)入的props和由state映射后inject的props,但要實(shí)現(xiàn)類似compted的功能,需要用到最新的hooks方案
方法,vue中的方法包括watch、methods;react中對(duì)應(yīng)watch的就是hooks方案,methods則不需要明確指定
slotvschildren,從功能上來看,這兩者是類似的,vue的slot更靈活,react的children更簡(jiǎn)潔composition apivshooks,兩者的目標(biāo)都是將代碼從關(guān)注組織結(jié)構(gòu)轉(zhuǎn)換為關(guān)注業(yè)務(wù)邏輯,并提供和this對(duì)象的解耦,從而能夠更高效地進(jìn)行組件的抽象和復(fù)用,但目前vue還不建議在生產(chǎn)環(huán)境下使用新特性
總的來看,vue屬于入手簡(jiǎn)單,但進(jìn)階困難的框架,大量的概念和底層API的暴露使得最佳實(shí)踐非常困難,很容易就進(jìn)入了各自為戰(zhàn)的混亂編碼階段,因此對(duì)于開發(fā)人員的要求反而更高,但與此同時(shí),一個(gè)高水平的vue開發(fā)人員則能夠開發(fā)出非常好的代碼,這也是vue的魅力所在;react更中規(guī)中矩一些,大量的社區(qū)輔助工具的出現(xiàn)使得開發(fā)規(guī)范變得更加標(biāo)準(zhǔn)化,提高下限的同時(shí)也限制了上限,使用react入手需要學(xué)習(xí)的內(nèi)容多一些,但最終其實(shí)需要了解的東西并不比vue多。
本來想舉一些例子,但是想想還是算了,掛一漏萬,還是不要多此一舉了。