摘要:使用組件當成標簽的形式放在結(jié)構(gòu)中,例如或。子組件通知父組件給子組件傳遞一個回調(diào)函數(shù),在子組件中執(zhí)行時,填入實參。生命周期鉤子函數(shù)掛載更新銷毀。組件內(nèi)部的狀態(tài)監(jiān)聽數(shù)據(jù)變化導(dǎo)航守衛(wèi)全局組件內(nèi)路由獨享。給子組件定制結(jié)構(gòu)不能給子組件定制結(jié)構(gòu)。
用 react 和 vue 開發(fā)過項目后,我有一點兒心得,對二者的特性進行一個對比,能夠發(fā)現(xiàn)一些同異之處。這是我在思否寫的第一篇文章,如果哪里寫得不對,請各位大佬糾正。雖然我還是個“小白”,但是如果我的總結(jié)能夠給比我更白的小小白一點兒幫助,那也是極好的~
React模板:JSX 把結(jié)構(gòu)直接寫在 js 中。
插值:{表達式},例如:
循環(huán)列表:[].map((obj) => 結(jié)構(gòu));
判斷:三元運算符或者 if else。
定義組件:函數(shù)組件、類組件。
使用組件:當成標簽的形式放在結(jié)構(gòu)中,例如:
給子組件傳遞數(shù)據(jù):通過 props 向子組件定制數(shù)據(jù)。
子組件通知父組件:給子組件傳遞一個回調(diào)函數(shù),在子組件中執(zhí)行時,填入實參。
事件系統(tǒng):寫在行間,駝峰命名法,如果需要傳實參,則把方法放在函數(shù)體里。
生命周期鉤子函數(shù):掛載、更新、銷毀。
組件內(nèi)部的狀態(tài):this.state = {};
監(jiān)聽數(shù)據(jù)變化:componentWillRecieveProps(nextProps){},推薦使用 getDerivedStateFromProps(nextProps, prevState)
導(dǎo)航守衛(wèi):react-router 4.0之后沒有導(dǎo)航守衛(wèi)。
給子組件定制結(jié)構(gòu):寫在組件標簽對中,子組件用 this.props.children 拿到。
Vue模板:寫在 中。
插值:{{表達式}}
循環(huán)列表:v-for
判斷:v-if 或者 v-show。
定義組件:.vue 文件。
使用組件:當成標簽的形式放在結(jié)構(gòu)中
給子組件傳遞數(shù)據(jù):通過 props 向子組件定制數(shù)據(jù)。
子組件通知父組件:通過 $emit 子組件傳給父組件數(shù)據(jù)。
事件系統(tǒng):寫在行間,通過 v-on(簡寫:@)綁定事件,事件名全小寫,如果需要傳參直接寫小括號,不會立即執(zhí)行,默認第一個參數(shù)是事件對象。
生命周期鉤子函數(shù):構(gòu)建、掛載、更新、銷毀。
組件內(nèi)部的狀態(tài):data(){return {};}
監(jiān)聽數(shù)據(jù)變化:watch: {}
導(dǎo)航守衛(wèi):全局、組件內(nèi)、路由獨享。
給子組件定制結(jié)構(gòu):不能給子組件定制結(jié)構(gòu)。
文章版權(quán)歸作者所有,未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址:http://specialneedsforspecialkids.com/yun/99502.html
摘要:上圖是二月份前端框架排名,位居第一,排名第三。我們認為前端模板和組件代碼是緊密相連的。直到最近看了文檔,才發(fā)現(xiàn)另有蹊蹺。 歡迎大家關(guān)注騰訊云技術(shù)社區(qū)-segmentfault官方主頁,我們將持續(xù)在博客園為大家推薦技術(shù)精品文章哦~ 紀俊,從事Web前端開發(fā)工作,2016年加入騰訊OMG廣告平臺產(chǎn)品部,喜歡研究前端技術(shù)框架。 這里要討論的話題,不是前端框架哪家強,因為在 Vue 官網(wǎng)就已經(jīng)...
平日學(xué)習接觸過的網(wǎng)站積累,以每月的形式發(fā)布。2017年以前看這個網(wǎng)址:http://www.kancloud.cn/jsfron... 03月份前端資源分享 1. Javascript 175453545 Redux compose and middleware 源碼分析 深入 Promise(二)——進擊的 Promise Effective JavaScript leeheys blog -...
平日學(xué)習接觸過的網(wǎng)站積累,以每月的形式發(fā)布。2017年以前看這個網(wǎng)址:http://www.kancloud.cn/jsfron... 03月份前端資源分享 1. Javascript 175453545 Redux compose and middleware 源碼分析 深入 Promise(二)——進擊的 Promise Effective JavaScript leeheys blog -...
平日學(xué)習接觸過的網(wǎng)站積累,以每月的形式發(fā)布。2017年以前看這個網(wǎng)址:http://www.kancloud.cn/jsfron... 03月份前端資源分享 1. Javascript 175453545 Redux compose and middleware 源碼分析 深入 Promise(二)——進擊的 Promise Effective JavaScript leeheys blog -...
閱讀 1714·2021-11-22 15:33
閱讀 2085·2021-10-08 10:04
閱讀 3543·2021-08-27 13:12
閱讀 3419·2019-08-30 13:06
閱讀 1467·2019-08-29 16:43
閱讀 1392·2019-08-29 16:40
閱讀 786·2019-08-29 16:15
閱讀 2746·2019-08-29 14:13