涓€.椤圭洰鍔熻兘鎻愰棶
vue鍚庡彴椤圭洰(杩欏嚑涓姛鑳界偣瑕佹眰閮借兘鐢ㄨ嚜宸辩殑璇濊鍑烘潵)
1.璺敱瀹堝崼 / 瀵艰埅瀹堝崼
鏃㈢劧鏄畧鍗紝棣栧厛鏄鍜变滑鍚庡彴椤甸潰璁块棶鐨勪竴灞備繚鎶わ紝濡傛灉鎴戞病鏈夎繘琛岀櫥闄嗚繃锛屽悗鍙扮殑鎿嶄綔椤甸潰鏄笉鍏佽鐢ㄦ埛璁块棶鐨?br>
鎴戜滑鏄敤鍒皏ue璺敱涓殑涓€涓挬瀛愬嚱鏁癰eforeEach锛岄偅涔堣繖涓嚱鏁颁腑鏈変笁涓弬鏁帮紝鍒嗗埆鏄痶o from next
to鏄幓鍝噷 from鏄粠鍝噷鏉?next涓嬩竴姝ヨ閫氫織鐐瑰氨鏄斁琛?br>
涓昏閫昏緫鏄垽鏂垜浠湁娌℃湁鐧诲綍锛岄偅涔堟垜浠彲浠ラ€氳繃鐧诲綍鍚庤幏鍙栧埌鐨則oken鏉ュ垽鏂?濡傛灉鏈塼oken灏辩洿鎺ext()鏀捐
濡傛灉娌℃湁鐨勫墠鎻愪笅锛屾垜浠啀鍒ゆ柇鐢ㄦ埛璁块棶鐨勯〉闈㈡槸涓嶆槸鐧婚檰椤甸潰鍚楋紝鏄殑璇濆氨鏀捐 涓嶆槸灏辫烦鍥炵櫥褰曢〉
token澶辨晥鏈燂紝鎴戜滑鍓嶇璇ュ浣曞鐞嗐€?/p>
2.鏉冮檺璺敱/鍔ㄦ€佽矾鐢?閴存潈
鏃㈢劧璇村埌鏉冮檺 閭ｄ箞鑲畾鏄牴鎹笉鍚岃处鎴峰緱鍒颁笉鍚岀殑鏉冮檺鏉ュ仛璺敱閰嶇疆鍜岃彍鍗曠殑娓叉煋
绗竴鐐瑰綋鎴戜滑鐧诲綍涔嬪悗浼氳幏鍙栧埌褰撳墠璐︽埛鐨勮韩浠斤紙鏉冮檺锛夛紝閭ｄ箞鎴戜滑鐨勮矾鐢遍厤缃疄闄呬笂灏辨槸涓€涓暟缁?br>
鎴戜滑瑕佸仛鐨勪簨鎯呭氨鏄妸鑾峰彇鍒扮殑韬唤涓庤繖涓暟缁勫仛瀵规瘮锛岄€氳繃鐩稿叧鐨勮绠楃瓫閫夊嚭鏈€缁堝尮閰嶅綋鍓嶈韩浠界殑璺敱閰嶇疆
鐒跺悗灏嗚绠楀嚭鏉ョ殑璺敱鏁扮粍閫氳繃router.addRouters鍔ㄦ€佹寕杞?br>
杩樿娉ㄦ剰鐨勪竴鐐瑰氨鏄渶瑕佸皢鎴戜滑绛涢€夊嚭鏉ョ殑璺敱閰嶇疆娓叉煋鍒版垜浠殑鍓嶇椤甸潰涓婂幓涓€涓€鐩稿搴?/p>
3.鎷︽埅鍣細璇锋眰鎷︽埅 鍝嶅簲鎷︽埅
璇锋眰鎷︽埅锛氬洜涓篽ttp鏄棤鐘舵€佺殑 鏃犳硶淇濆瓨鎴戜滑鐨勭姸鎬侊紝閭ｄ箞鎴戜滑灏遍渶瑕佷竴涓爣璇?br>
褰撴垜浠櫥褰曚箣鍚庯紝鍚庣画鐨勬墍鏈夎姹傛搷浣滈兘闇€瑕佹惡甯︽垜浠繖涓猼oken锛屾墍浠ユ垜浠粺涓€鎶婂畠娣诲姞鍒拌姹傚ご褰撲腑锛岄伩鍏嶄簡
鏃犳剰涔夎姹?/p>
鍝嶅簲鎷︽埅锛氬綋璁剧疆浜嗗搷搴旀嫤鎴悗鎵€鏈夌殑鍝嶅簲閮戒細缁忚繃瀹冿紝鎵€浠ユ柟渚挎垜浠粺涓€澶勭悊鍝嶅簲鏁版嵁鍋氱浉鍏崇殑鎿嶄綔
4.澧?鍒?鏀?鏌ワ紙澧炲姞鏁版嵁椤癸級
杩欎簺鎿嶄綔閮芥槸閽堝涓庢暟鎹潵杩涜鎿嶄綔
澧烇細鎴戜滑瑕佸鍔犱竴鏉℃暟鎹垨鑰呭鏉℃暟鎹紝棣栧厛绗竴鐐规垜浠渶瑕佽幏鍙栧埌澧炲姞鐨勬暟鎹紝鐒跺悗閫氳繃鍚庡彴鎻愪緵鐨勭浉鍏虫帴鍙ｏ紝鎶婃暟鎹綔涓哄弬鏁颁紶閫掞紝褰撳悗鍙版嬁鍒版垜鐨勬暟鎹悗寰€鏁版嵁搴撲腑杩藉姞杩欎簺鏁版嵁锛岀劧鍚庡皢鏈€鏂扮殑鏁版嵁鍝嶅簲缁欐垜浠紝涔嬪悗鍐嶈繘琛屾覆鏌?/p>
鍒狅細棣栧厛鑾峰彇鍒拌鍒犻櫎鐨勮繖鏉℃暟鎹敮涓€鏍囪瘑鍙兘鏄疘D 鍙兘鏄痗ode锛岀劧鍚庨€氳繃鍚庡彴鎻愪緵鐨勭浉鍏虫帴鍙ｏ紝鎶婅繖涓爣璇嗕綔涓哄弬鏁颁紶閫掞紝褰撳悗鍙版嬁鍒板悗灏变細鍒犻櫎杩欎釜鏍囪瘑鐩稿搴旂殑鏁版嵁锛岀劧鍚庡皢鏈€鏂扮殑鏁版嵁鍝嶅簲缁欐垜浠紝涔嬪悗鍐嶈繘琛屾覆鏌?/p>
鏀癸細棣栧厛鑾峰彇鍒拌淇敼鐨勮繖鏉℃暟鎹敮涓€鏍囪瘑鍙兘鏄疘D 鍙兘鏄痗ode锛岀劧鍚庡墠绔繘琛屾暟鎹敼鍔紝鐒跺悗閫氳繃鍚庡彴鎻愪緵鐨勭浉鍏虫帴鍙ｏ紝鎶婃暟鎹綔涓哄弬鏁颁紶閫掞紝褰撳悗鍙版嬁鍒版垜鐨勬暟鎹悗寰€鏁版嵁搴撲腑淇敼杩欎釜鏍囪瘑鐩稿搴旂殑鏁版嵁锛岀劧鍚庡皢淇敼鍚庣殑鏁版嵁鍝嶅簲缁欐垜浠紝涔嬪悗鍐嶈繘琛屾覆鏌?/p>
鏌ワ細涓嶈鍙傛暟锛?涓嶉渶瑕佷紶閫掍换浣曞弬鏁帮紝鐩存帴璋冪敤鎺ュ彛鑾峰彇鎵€鏈夋暟鎹?br> 闇€瑕佸弬鏁帮紝棣栧厛绗竴鐐规垜浠渶瑕佽幏鍙栧埌闇€瑕佹煡璇㈢殑鍏抽敭瀛楃劧鍚庨€氳繃鍚庡彴鎻愪緵鐨勭浉鍏虫帴鍙ｏ紝鎶婅繖浜涘叧閿瓧浣滀负鍙傛暟浼犻€掞紝褰撳悗鍙版嬁鍒拌繖涓叧閿瓧鎶婄浉瀵瑰簲鐨勬暟鎹搷搴旂粰鎴戜滑锛屼箣鍚庡啀杩涜娓叉煋
5.axios鐨勫皝瑁?/h3>
涓轰簡鏂逛究浣跨敤鎴戜滑杩涜浜嗗皝瑁?br>
棣栧厛鎴戜滑灏佽涓€涓猤et鎴栬€卲ost鐨勮繖浜涙柟娉曪紝鐒跺悗閫氳繃杩斿洖涓€涓猵romise瀵硅薄杩涜浣跨敤
鍦╬romise涓€氳繃.then鍜?catch鎷垮埌axios璇锋眰缁撴灉
鐒跺悗閫氳繃宸ュ叿灞傚皢涓嶅悓鐨勪笟鍔＄増鍧楅渶瑕佽皟鐢ㄧ殑鎺ュ彛杩涜妯″潡鍖栧啀鏆撮湶鍑哄幓
鍦ㄦ垜浠殑浣嗛〉闈腑寮曞叆鐩稿浜庣殑鎺ュ彛妯″潡锛岀劧鍚庤皟鐢紝鍥犱负鎴戜滑搴曞眰灏佽鐨勬槸涓€涓猵romise瀵硅薄
鎵€浠ユ垜浠彲浠ラ€氳繃ES7涓殑 async await鐩存帴鎷垮埌鍝嶅簲鏁版嵁
浜屻€佺煡璇嗙偣鎻愰棶:
1.vue甯哥敤鎸囦护鏈夊摢浜?
v-for /v-bind(馃槂 /v-if/ v-show/ v-else-if /v-else/ v-model / v-on(@) / v-text / v-html / v-once /
v-prev / v-cloak
2.computed鍜寃atch鐨勫尯鍒槸浠€涔?
computed 涓€瀵瑰, 澶氭璋冪敤鏃?浼氭妸绗竴娆¤皟鐢ㄧ殑缁撴灉鏀惧叆缂撳瓨锛岃妭绾︽€ц兘
瀹氫箟鐨勫嚱鏁板繀椤昏鍐?return锛屼笉鐒朵細鎶ラ敊
璋冪敤鐨勬椂鍊欎笉鑳藉姞鎷彿锛屼笉鐒朵細鎶ラ敊
鍦╟omputed涓畾涔変竴涓嚱鏁帮紙鐪嬭捣鏉ユ槸涓€涓嚱鏁帮紝鍏跺疄鏄竴涓睘鎬э級
watch 澶氬涓€ 鍙洃鍚?涓嶄細浜х敓鏂扮殑鍑芥暟鍚?watch涔熷彲浠ユ覆鏌撴暟鎹?浣嗘槸鍜宑omputed姣旇緝灏辨瘮杈冨鏉?/p>
3.v-if 鍜?v-show鐨勫尯鍒槸浠€涔堜粈涔堟椂鍊欎娇鐢╲-if鏇村ソ浠€涔堟椂鍊欑敤v-show鏇村ソ?
v-show 鍙互鎿嶄綔display灞炴€?涓昏鐢ㄤ簬棰戠箒鎿嶄綔
v-if 閿€姣佸拰鍒涘缓鍏冪礌,涓昏鏄敤浜庡ぇ閲忔暟鎹覆鏌撳埌椤甸潰鏃朵娇鐢ㄧ鍚堟潯浠跺氨灏嗘暟鎹覆鏌?棰戠箒浣跨敤浼氭秷鑰楁€ц兘
4.鏁扮粍甯哥敤鏂规硶鏈夊摢浜?
pop/ push/ shirf/ unshirf/ reverse/ sort/ splice
find/ findIndexOf/ indexOf / every / some / forEach / map / includes / join / concat / filter / flat /slice
5.new鎿嶄綔鍏蜂綋骞蹭簡浠€涔?
鍦ㄥ爢绌洪棿涓垱寤轰竴涓璞?br>
this鎸囧悜杩欎釜瀵硅薄
鎵ц鏋勯€犲嚱鏁扮殑璇彞
杩斿洖杩欎釜瀵硅薄
6.璇蜂互鑷繁鐞嗚В璁茶Вjs鍫嗗拰鏍堬紝浠ュ強娣辨嫹璐濇€庝箞瑙ｅ喅锛燂紙閲嶇偣锛?/h3>
鍫嗘槸鐢ㄦ潵瀛樻斁寮曠敤鏁版嵁绫诲瀷,渚嬪瀵硅薄,鏁扮粍,鍑芥暟
鏍堟槸鐢ㄦ潵瀛樻斁鍩烘湰鏁版嵁绫诲瀷,鍙橀噺鍜屽紩鐢ㄦ暟鎹被鍨嬬殑鍦板潃鍊?; 浣撶Н灏?鏁版嵁缁忓父鍙樺寲
娣辨嫹璐濈殑瑙ｅ喅鏂规 :
1.浣跨敤lodash 鎻掍欢
2.浣跨敤閫掑綊瑙ｅ喅娣辨嫹璐?br>
3.濡傛灉鏁版嵁涓病鏈夊嚱鏁?undefined 鍙互浣跨敤json.stringify+json.parse瀹炵幇娣辨嫹璐?/p>
7.璺ㄥ煙寮曡捣鐨勫師鍥狅紝浠ュ強寮€鍙戞椂鐨勮В鍐虫柟妗?
璺ㄥ煙: 闈炲悓婧愮瓥鐣ョ殑灏卞彨璺ㄥ煙
鍚屾簮绛栫暐灏辨槸鐩稿悓鐨刪ttp,鐩稿悓鐨勫湴鍧€,鐩稿悓鐨勭鍙?br>
瑙ｅ喅鏂规硶: 1 nginx鍙嶅悜浠ｇ悊
8.vue鐨?绉嶇粍浠堕€氫俊鏂瑰紡?锛堥噸鐐癸級
1 鐖跺瓙閫氫俊
鍦ㄥ祵濂楃粍浠朵腑,鐖剁粍浠朵腑鐨刐瀛愮粍浠舵爣绛綸 缁戝畾鑷畾涔夊睘鎬?
鍦ㄥ瓙缁勪欢涓?props: { 瀛愮粍浠舵爣绛捐嚜瀹氫箟鐨勫睘鎬у悕: { type: , default} }
2 瀛愮埗閫氫俊
鍦ㄥ祵濂楃粍浠朵腑,鐖剁粍浠朵腑鐨刐瀛愮粍浠舵爣绛綸 ,鑷畾涔変簨浠禓fn=鈥溾€?
鍦ㄥ瓙缁勪欢涓?瑙﹀彂杩欎釜鑷畾涔変簨浠?br>
.emit(鈥?鑷畾涔夌殑浜嬩欢 鍚嶁€?, 鏁版嵁 ) // 鏍囩涓殑鍐欐硶
this.emit() // js涓殑鍐欐硶
鍦ㄧ埗缁勪欢鐨勬柟娉曚腑 褰㈠弬鎺ユ敹鏁版嵁
3 闈炵埗瀛愰€氫俊(鍏勫紵閫氫俊)
$eventBus
9.vue涓璳ey鐨勫敮涓€鎬х殑浣滅敤锛屼互鍙婂紓姝ュ姞杞界粍浠剁殑鏂瑰紡锛?/h3>
key鐨勫敮涓€鎬у彲浠ョ粰姣忎竴涓妭鐐规湁涓€涓敮涓€鏍囪瘑,褰撴坊鍔犳垨鍒犻櫎鑺傜偣鏃?閫氳繃瀵规瘮鏁版嵁鍓嶅悗鐨勫彉鍖?鍙敤鎿嶄綔鏌愪釜鍙樺寲鐨勮妭鐐?涓嶉渶瑕侀噸鏂版覆鏌撴墍鏈夌殑鏁版嵁,鎻愰珮浜嗘€ц兘
寮傛鍔犺浇缁勪欢: () => import(鈥樷€?鈥?鈥?
10.bfc鍖哄煙鐨勭悊瑙ｏ紵
Block Formatting context 鍧楃骇鏍煎紡鍖栦笂涓嬫枃
鎴愮珛鏉′欢鏈? display:inline-block 鎴栬€?position:absolute/ fixed
甯哥敤浜巑argin绌块€?楂樺害濉岄櫡
11.es6鐨勬柊澧炵壒鎬?/h3>
绠ご鍑芥暟,瀵硅薄灞炴€х殑绠€鍐?瑙ｆ瀯璧嬪€?妯℃澘瀛楃涓?绫?绫荤殑缁ф壙),鎵╁睍杩愮畻绗?妯″潡鍖?moudle),promise,Async / Await (ES7),let const 鍧楃骇浣滅敤鍩?/p>
12.浜嬩欢鍐掓场/鎹曡幏锛屼互鍙婁簨浠跺鎵樸€傦紙閲嶈锛?/h3>
鎹曡幏: 浠巇ocument寮€濮?灞傚眰瀛愬厓绱犱紶閫?鐩村埌鐐瑰嚮鍒板綋鍓嶅瓙鍏冪礌
鍐掓场: 浠庣偣鍑诲綋鍓嶅瓙鍏冪礌寮€濮?灞傚眰鐖剁骇浼犻€?鐩村埌document
浜嬩欢濮旀墭: 灏嗗瓙鍏冪礌鐨勪簨浠朵氦缁欑埗鍏冪礌澶勭悊(涓昏鏄坊鍔犳柊鐨勮妭鐐?鏄棤娉曠粦瀹氫簨浠?杩欎釜鏃跺€欓渶瑕佷簨浠跺娲?
缁欑埗鍏冪礌缁戝畾浜嬩欢,閫氳繃鎹曡幏鐨勮繃绋嬫潵鑾峰彇浜嬩欢,骞堕€氳繃etarget鏉ヨ幏鍙栫洰鏍囧厓绱?/p>
13.cookie/localstorage/session鍖哄埆锛堥噸瑕侊級
localstorage 鏈湴瀛樺偍,鍙湁鎵嬪姩鍒犻櫎鎵嶄細閿€姣?br>
session鏁版嵁淇濆瓨鍦ㄦ湇鍔″櫒绔?鐢熷懡鍛ㄦ湡鐢辨湇鍔″櫒绔喅瀹?br>
cookie鏁版嵁淇濆瓨鍦ㄥ鎴风 鍙湁4k宸﹀彸
session鍜宑ookie 閮芥槸鐢ㄦ潵璺熻釜娴忚鍣ㄧ敤鎴疯韩浠界殑浼氳瘽鏂瑰紡
14.$nextTick鐢ㄨ繃鍚楋紝鏈変粈涔堜綔鐢紵
瑙嗗浘鏇存柊涔嬪悗,鍩轰簬鏂扮殑瑙嗗浘杩涜鎿嶄綔
涓€鑸琧reated鐨勬椂鍊檇om娌℃湁娓叉煋锛屽鏋滆鎿嶄綔dom锛屾渶濂芥斁鍦╰his.$nextTick(()=>{})鍥炶皟鍑芥暟 涓畬鎴?/p>
15.vue-router璺敱鐨勪紶鍙傛柟寮忥紙閲嶈锛?/h3>
绗竴绉嶏細浣跨敤router鐨刵ame灞炴€т篃灏辨槸params鏉ヤ紶閫掑弬鏁?br>
浼犲€奸〉闈?
this.r o u t e r . p u s h ( n a m e : " 璺敱閰嶇疆涓搴旂殑 n a m e 鍚?" , p a r a m s : 鍙傛暟 ) 鍙栧€奸〉闈?t h i s . router.push({name:"璺敱閰嶇疆涓搴旂殑name鍚?,params:{鍙傛暟}}) 鍙栧€奸〉闈?this.router.push(name:"璺敱閰嶇疆涓搴旂殑name鍚?,params:鍙傛暟)鍙栧€奸〉闈his.route.params.userId
绗簩绉嶏細浣跨敤query鏉ヤ紶閫掑弬鏁?br> 浼犲€奸〉闈?br> this.r o u t e r . p u s h ( p a t h : " / l o g i n " , q u e r y : 鍙傛暟 ) 鍙栧€奸〉闈?t h i s . router.push({path:"/login",query:{鍙傛暟}}) 鍙栧€奸〉闈?this.router.push(path:"/login",query:鍙傛暟)鍙栧€奸〉闈his.route.query.userId
绗笁绉嶏細浣跨敤vue閲岀殑鏍囩鏉ヤ紶閫掑弬鏁?br>
浼犲€奸〉闈?br>
Hi椤甸潰1
鍙栧€奸〉闈?br>
this.$route.params.userId
绗洓绉?: 鍔ㄦ€佽矾鐢变紶鍙?br> this.router.push(鈥?/./鈥?+ id )鍙栧€奸〉闈his.route.params.id
16.鍑芥暟鐨勯槻鎶栧拰鑺傛祦銆傦紙閲嶈锛?/h3>
闃叉姈鐨勪綔鐢ㄦ槸锛氬綋鐢ㄦ埛澶氭瑙﹀彂鍥炶皟鍑芥暟鏃讹紝鍙Е鍙戞渶鍚庝竴娆℃搷浣滅殑锛屽叾浣欑殑鍏ㄩ儴蹇界暐鎺夛紱
鍑芥暟鑺傛祦锛氭槸纭繚鍑芥暟鐗瑰畾鐨勬椂闂村唴鑷冲鎵ц涓€娆?/p>
17.璁茶В涓嬫祻瑙堝櫒鐨勯噸缁樺拰鍥炴祦锛堥噸瑕侊級
鍥炴祦 (Reflow):褰揜ender Tree涓儴鍒嗘垨鍏ㄩ儴鍏冪礌鐨勫昂瀵搞€佺粨鏋勩€佹垨鏌愪簺灞炴€у彂鐢熸敼鍙樻椂锛屾祻瑙堝櫒閲嶆柊娓叉煋閮?鍒嗘垨鍏ㄩ儴鏂囨。鐨勮繃绋嬬О涓哄洖娴併€?br>
浼氬鑷村洖娴佺殑鎿嶄綔锛?br>
椤甸潰棣栨娓叉煋
娴忚鍣ㄧ獥鍙ｅぇ灏忓彂鐢熸敼鍙?br>
鍏冪礌灏哄鎴栦綅缃彂鐢熸敼鍙?br>
鍏冪礌鍐呭鍙樺寲锛堟枃瀛楁暟閲忔垨 鍥剧墖澶у皬绛夌瓑锛?br>
鍏冪礌瀛椾綋澶у皬鍙樺寲
娣诲姞鎴栬€呭垹闄ゅ彲瑙佺殑DOM鍏冪礌
婵€娲籆SS浼被锛堜緥 濡傦細:hover锛?br>
鏌ヨ鏌愪簺灞炴€ф垨璋冪敤鏌愪簺鏂规硶
閲嶇粯 (Repaint)
褰撻〉闈腑鍏冪礌鏍峰紡鐨勬敼鍙樺苟涓嶅奖鍝嶅畠鍦ㄦ枃妗ｆ祦涓殑浣嶇疆鏃讹紙渚嬪锛歝olor銆乥ackground-color銆乿isibility绛夛級锛屾祻瑙堝櫒浼氬皢鏂版牱寮忚祴浜堢粰鍏冪礌骞堕噸鏂扮粯鍒跺畠锛岃繖涓繃绋嬬О 涓洪噸缁樸€?br>
鍥炴祦涓€瀹氫細瀵艰嚧閲嶇粯,閲嶇粯涓嶄竴瀹氫細鍥炴祦
18.js鐨勫唴瀛樻硠闇诧紝浠ュ強vue涓父娉ㄦ剰鐨勪袱绉嶏紙閲嶈锛?/h3>
闂寘
ie9涔嬪墠閲囩敤鐨勫紩鐢ㄨ鏁扮畻娉?br>
鎰忓鐨勫叏灞€鍙橀噺
19.璇锋眰鎬庝箞甯oken锛燂紙鏀惧叆浜嗗摢閲岋紵姣忔璇锋眰鍓嶅仛浜嗕粈涔堟搷浣滐級 锛堥噸瑕侊級
1, 鑾峰彇鏈湴瀛樺偍涓殑 token,骞舵斁鍦ㄨ姹傛嫤鎴櫒涓?杩欐牱鎵€鏈夌殑璇锋眰閮藉彲浠ョ洿鎺ラ€氳繃璇锋眰鎷︽埅鍣ㄥ皢token浼犵粰鏈嶅姟鍣?/p>
20.git鎷垮埌椤圭洰鍦板潃鏃讹紝鍒颁慨鏀规彁浜ゅ仛鐨勬祦绋嬨€?/h3>
1 git clone 鍦板潃
2 git checkout -b 鍒嗘敮鍚?br>
3 git add .
4 git commit -m"澶囨敞"
5 git checkout master
6 git merge 鍒嗘敮鍚?br>
7 git push origin master
棣栧厛闇€瑕侀€氳繃鍏嬮殕椤圭洰鍦板潃,灏嗛」鐩媺鍙栧埌鏈湴浠撳簱,鍒涘缓鏂扮殑鍒嗘敮,鍦ㄥ垎鏀笂缂栧啓浠ｇ爜,鍐欏畬鍔熻兘鍚?鎻愪氦骞朵繚瀛樺埌鏈湴浠撳簱.鍚堝苟鍒嗘敮鍚庢帹閫佸埌杩滅▼浠撳簱
21.post鍜実et鐨勫尯鍒紵
get 鐨勫弬鏁颁細鏄剧ず鍦ㄥ湴鍧€鏍?涓嶅畨鍏? 鍙紶鐨勬暟鎹噺灏?br> post浼犵殑鍙傛暟涓嶄細鍦ㄥ湴鍧€鏍忔樉绀?鐩稿瀹夊叏,鍙紶鐨勬暟鎹噺澶?/p>
22.element琛ㄦ牸涓紝濡傛灉鐐瑰嚮鎷垮綋鍓嶈鐨勬暟鎹€庝箞鍐欙紵
浣跨敤鎻掓Ы鐨勬牸寮?v-slot={row} 灏卞彲浠ヨ幏鍙栧埌褰撳墠琛岀殑鏁版嵁
23.鎬濊€冨鏋滆淇敼涓婁紶瀹屽ご鍍忓悗鎬庝箞锛屽幓鍚屾閫氱煡澶撮儴鐨勫ご鍍忔洿鏂帮紝鐢ㄥ埌缁勪欢鐨勫摢涓紵
淇敼澶村儚鍚?鍦╤eader缁勪欢 created閽╁瓙涓彂閫佽姹傝幏鍙栫敤鎴蜂俊鎭?
24.promise鍜宎sync/await鍖哄埆锛岀畝娲佽杩帮紵 锛堥噸瑕侊級
promise鏄疎S6锛宎sync/await鏄疎S7
async/await鐩稿浜巔romise鏉ヨ锛屽啓娉曟洿鍔犱紭闆?br>
reject鐘舵€侊細
1锛塸romise閿欒鍙互閫氳繃catch鏉ユ崟鎹夛紝寤鸿灏鹃儴鎹曡幏閿欒锛?锛塧sync/await鏃㈠彲浠ョ敤.then鍙堝彲浠ョ敤try-catch鎹曟崏
25.get鍜宲ost鐨勫尯鍒?锛堥噸瑕侊級
GET鍦ㄦ祻瑙堝櫒鍥為€€鏃舵槸鏃犲鐨?鑰孭OST浼氬啀娆℃彁浜よ姹?br>
GET璇锋眰浼氳娴忚鍣ㄤ富鍔╟ache,鑰孭OST涓嶄細,闄ら潪鎵嬪姩璁剧疆
GET璇锋眰鍙兘杩涜url缂栫爜,鑰孭OST鏀寔澶氱缂栫爜鏂瑰紡
GET璇锋眰鍙傛暟浼氳瀹屾暣淇濈暀鍦ㄦ祻瑙堝櫒鍘嗗彶璁板綍閲?鑰孭OST鐨勫弬鏁颁笉浼氫繚鐣?br>
GET璇锋眰鍦║RL涓紶閫佺殑鍙傛暟鏈夐暱搴﹂檺鍒?鑰孭OST娌℃湁
GET姣擯OST鏇翠笉瀹夊叏,鍥犱负鍙傛暟鐩存帴鏆撮湶鍦║Rl涓?涓嶈兘鐢ㄦ潵浼犻€掓晱鎰熶俊鎭?
GET鍙傛暟閫氳繃URl浼犻€?POST鍙傛暟鏀惧湪Request body涓?br>
瀵逛簬鍙傛暟鐨勬暟鎹被鍨?GET鍙帴鍙桝SCII瀛楃,鑰孭OST娌℃湁闄愬埗
GET鍜孭OST鏈川涓婂氨鏄疶CP閾炬帴锛屽苟鏃犲樊鍒€備絾鏄敱浜嶩TTP鐨勮瀹氬拰娴忚鍣?鏈嶅姟鍣ㄧ殑闄愬埗锛屽鑷翠粬浠湪搴旂敤杩囩▼涓綋鐜板嚭涓€浜涗笉鍚屻€?/p>
26.vue椤圭洰涓綘鍋氱殑浼樺寲锛燂紙閲嶈锛?/h3>
灏忓埌浠ｇ爜锛歨tml鐨勭粨鏋?css鐨勬牱寮?js澶勭悊鏁版嵁鏃跺€檈s6鐨勬柊鐗规€?鐢熷懡鍛ㄦ湡閿€姣佷紭鍖?br>
澶у埌椤圭洰缁撴瀯锛氭ā鍧楁敼閫?缁勪欢鎶藉彇
vue鏈韩锛歷-if鍜寁-for鐨勪娇鐢?build鎵撳寘鏃?sprite绮剧伒鍥?/p>
27.mvvm鍜宮vc鍖哄埆锛熷畠鍜屽叾瀹冩鏋秊query鐨勫尯鍒?/h3>
瑙嗗浘缁撴瀯鐨勬蹇靛尯鍒紝涓€涓暟鎹┍鍔ㄤ竴涓簨浠舵搷浣滐紝姣斿鍚庤€呭涓烘煡鎵綿om缁撴瀯杩涜鎿嶄綔锛屽墠鑰呬负娓叉煋鏃跺氨缁戝畾浜唌ethods鏂规硶锛屼笉鐢ㄦ煡鎵?/p>
28.vue椤甸潰涔嬮棿鐨勪紶鍙傦紙閲嶈锛?/h3>
query 鍦板潃鏍忔樉绀猴紝鍒锋柊涓嶄涪澶憋紝绫讳技get
params 鍦板潃鏍忎笉鏄剧ず锛岄殣钘忎紶鍙傦紝鍒锋柊涓㈠け绫讳技post
/:id 鍔ㄦ€佷紶鍙傦紝鍒锋柊涓嶄涪澶卞悓query
29.ES6 Promise 鐢ㄦ硶锛屼互鍙婁娇鐢ㄥ満鏅紵
绛夊緟鎺ュ彛瀹屾垚锛岃繘琛屼笅涓€姝ユ搷浣滅敤promise
閰嶅悎async鍜宎wait杩涜锛岃姹傛暟鎹洖鐨勭粨鏋勶紝鍙堟垨鑰呯瓑寰呭畬鎴愯繘琛屾搷浣?/p>
30.璇磋浣犱滑鍏徃浜у搧寮€鍙戞祦绋嬫垨web鍓嶇鐨勫紑鍙戞祦绋嬶紵
浜у搧纭畾杩唬闇€姹?璁捐杩涜璁捐绋胯璁?灏忕粍浼氳璁ㄨ瀹炵幇鍙鎬э紝浠ュ強鍚庣鍓嶇鍙戣〃鎰忚/鍓嶇鍐欓〉闈紝鍚庣寮€鍙戞帴鍙?璋冭瘯鎺ュ彛/鑷祴瀹屾垚缁欐祴璇曚汉鍛樻祴璇?涓婄嚎
31.vue鐨勭敓鍛藉懆鏈熸槸浠€涔?
beforeCreate :鍒涘缓vue瀹炰緥 data computed watch methods涓嶈兘璁块棶;
created: 鍙互瀵筪ata鏁版嵁杩涜鎿嶄綔, 鍙繘琛屼竴浜涜姹?浣嗕笉鏄撹繃澶?閬垮厤鐧藉睆鏃堕棿澶暱
beforeMount:鍒ゆ柇鏄惁鏈塼emplate杩涜娓叉煋淇濆瓨鍒板唴瀛樺綋涓?浣嗚繕鏈寕杞藉湪椤甸潰涓?
mounted: 灏嗗唴瀛樹腑鐨勬ā鍧楁寕杞藉埌椤甸潰涓?,姝ゆ椂鍙互鎿嶄綔椤甸潰涓婄殑DOM鑺傜偣,浣嗚繕鏈寕杞藉湪椤甸潰涓?br>
beforeUpdate: 椤甸潰鏄剧ず鐨勬暟鎹槸鏃х殑,姝ゆ椂data閲岀殑鏁版嵁鏄渶鏂?椤甸潰鏁版嵁鍜宒ata鏁版嵁杩樻病鍚屾;
updated : 鏍规嵁data閲岀殑鏈€鏂版暟鎹覆鏌撳嚭鏈€鏂扮殑DOM鏍?鐒跺悗鎸傝浇鍒伴〉闈?br>
beforeDestroy:姝ゆ椂缁勪欢浠庤繍琛岃繘鍏ュ埌閿€姣侀樁娈?data鍜宮ethods鍙敤 閿€姣佽繕鏈墽琛?
destroyed : 缁勪欢宸茬粡瀹屽叏閿€姣?鎵€鏈夌殑鏂规硶鎸囦护绛夐兘涓嶅彲浣跨敤
32.鎻掓Ы鐨勪綔鐢ㄤ互鍙婁娇鐢ㄦ柟寮忥紵
缁勪欢鍖栨椂鍊欙紝鏈夋椂闇€瑕佽鍐呭鏄剧ず鍒版寚瀹氫綅缃紝鐢╯lot鐨勫啓娉曪紝灞曠ず鍑洪粯璁ゅ唴瀹规垨鑷畾涔夊唴瀹广€?br> 鎴栬€呭叿鍚嶅拰鍖垮悕鎻掓Ы鐨勬柟寮忕敤娉曪紝鍏峰悕鍙互鎸囧畾浣嶇疆
33.vue鐨勫崟椤规暟鎹祦?
绛?鏁版嵁浠庣埗绾х粍浠朵紶閫掔粰瀛愮粍浠?瀛愮粍浠跺唴閮ㄤ笉鑳界洿鎺ヤ慨鏀逛粠鐖剁骇浼犻€掕繃鏉ョ殑鏁版嵁銆傝繖鏍烽槻姝㈠瓙缁勪欢鎰忓鏀瑰彉鐖剁粍浠剁殑鐘舵€?/p>
34.vue涓湁娌℃湁鐢ㄨ繃缁勪欢閫氫俊鏂瑰紡 (蹇呰儗)
鐖朵紶瀛?鐖剁粍浠朵腑,瀛愮粍浠朵笂閫氳繃灞炴€х粦瀹氱殑鏂瑰紡鍚戝瓙涓紶閫?瀛愪腑鐢╬rops鎺ユ敹鍗冲彲
瀛愪紶鐖?閫氳繃e m i t 鍏朵腑鏈変袱涓弬鏁扮涓€涓綔涓虹埗涓殑浜嬩欢鍑芥暟 , 绗簩涓槸瑕佷紶閫掔殑鏁版嵁 , 鐖朵腑鍦ㄨЕ鍙戝嚱鏁扮殑褰㈠弬涓嬁鍒颁贡浼?/ 鍏勫紵浼?: 鍦?m a i n . j s 涓厛缁?v u e 鍘熷瀷涓婃寕杞戒竴涓?v u e 瀹炰緥 , 鍦ㄧ粍寤轰腑鐢?emit 鍏朵腑鏈変袱涓弬鏁?绗竴涓綔涓虹埗涓殑浜嬩欢鍑芥暟,绗簩涓槸瑕佷紶閫掔殑鏁版嵁,鐖朵腑鍦ㄨЕ鍙戝嚱鏁扮殑褰㈠弬涓嬁鍒?涔变紶/鍏勫紵浼?鍦╩ain.js涓厛缁檝ue鍘熷瀷涓婃寕杞戒竴涓獀ue瀹炰緥,鍦ㄧ粍寤轰腑鐢╡mit鍏朵腑鏈変袱涓弬鏁扮涓€涓綔涓虹埗涓殑浜嬩欢鍑芥暟,绗簩涓槸瑕佷紶閫掔殑鏁版嵁,鐖朵腑鍦ㄨЕ鍙戝嚱鏁扮殑褰㈠弬涓嬁鍒颁贡浼?鍏勫紵浼?鍦╩ain.js涓厛缁檝ue鍘熷瀷涓婃寕杞戒竴涓獀ue瀹炰緥,鍦ㄧ粍寤轰腑鐢╡mit鏉ラ€氱煡 o n 鏉ョ洃鍚埌 on鏉ョ洃鍚埌on鏉ョ洃鍚埌emit鐨勯€氱煡鍗冲彲
35.v-on鍙互鐩戝惉澶氫釜鏂规硶涔堣娉ㄦ剰浠€涔?(蹇呰儗)
鍙互,
1.褰撴病鏈夊弬鏁颁紶閫掓椂锛屾柟娉曞悕绉板悗闈㈠彲浠ヤ笉鍔犲皬鎷彿
2.褰撻渶瑕佷紶閫掑弬鏁版椂锛屼笖鍙湁涓€涓弬鏁伴渶瑕佷紶閫掞紝鑰屾病鏈夎繘琛屼紶閫掞紝浼氶粯璁よ緭鍑烘祻瑙堝櫒鐨別vent瀵硅薄
3.褰撻渶瑕佷紶閫掑涓弬鏁版椂锛屾兂瑕佽幏鍙栨祻瑙堝櫒鐨別vent瀵硅薄锛岄渶瑕佸湪鍓嶉潰鍔?绗﹀彿
36.vue涓璻ef鐨勪綔鐢ㄦ槸浠€涔?(蹇呰儗)
浣滅敤涓€锛堝熀鏈敤娉曪級:鏈〉闈㈣幏鍙杁om鍏冪礌
浣滅敤浜岋細鑾峰彇瀛愮粍浠朵腑鐨刣ata
浣滅敤涓夛細璋冪敤瀛愮粍浠朵腑鐨勬柟娉?br>
浣滅敤鍥涳細瀛愮粍浠惰皟鐢ㄧ埗缁勪欢鏂规硶
37.ES6鐨勬柊鐗规€ф湁鍝簺?(蹇呰儗)
鍒椾妇甯哥敤鐨凟S6鐗规€э細
let銆乧onst
绠ご鍑芥暟
绫荤殑鏀寔
瀛楃涓叉ā鍧?br>
symbols
Promises
鏁版嵁瑙ｆ瀯
灞曞紑杩愮畻绗?/p>
38.浠€涔堟槸浜嬩欢濮旀墭?(蹇呰儗)
璁╁埄鐢ㄤ簨浠跺啋娉＄殑鍘熺悊锛岃鑷繁鐨勬墍瑙﹀彂鐨勪簨浠讹紝璁╀粬鐨勭埗鍏冪礌浠ｆ浛鎵ц锛?/p>
39.
router 鐨勫尯鍒?(蹇呰儗)
router涓篤ueRouter鐨勫疄渚嬶紝鐩稿綋浜庝竴涓叏灞€鐨勮矾鐢卞櫒瀵硅薄锛岄噷闈㈠惈鏈夊緢澶氬睘鎬у拰瀛愬璞★紝
渚嬪history瀵硅薄,缁忓父鐢ㄧ殑璺宠浆閾炬帴灏卞彲浠ョ敤this.$router.push锛屽拰router-link璺宠浆涓€鏍枫€傘€傘€?br>
route鏄竴涓烦杞殑璺敱瀵硅薄锛屾瘡涓€涓矾鐢遍兘浼氭湁涓€涓猺oute瀵硅薄锛屾槸涓€涓眬閮ㄧ殑瀵硅薄锛屽彲浠ヨ幏鍙栧搴旂殑name,path,params,query绛?/p>
40鈥︿粈涔堟槸鍘熷瀷閾?(蹇呰儗)
绛?瀹炰緥瀵硅薄浼氬厛鏌ユ壘鑷韩鏈夋病鏈夋墍闇€鎴愬憳,濡傛灉娌℃湁灏变細閫氳繃proto鍚戞瀯閫犲嚱鏁扮殑prototype涓煡鎵?br>
濡傛灉杩樻槸娌℃湁,鍙堜細閫氳繃鏋勯€犲嚱鏁扮殑prototype鐨刾roto鍘绘壘鍒皁bject鐨刾rototype,杩樻槸娌℃湁鎵惧埌
灏变細閫氳繃object鐨刾rototype鐨刾roto鎵惧埌null 鍍忚繖鏍风敤proto涓€灞傚眰寰€涓婃煡鎵剧殑鏂瑰紡,绉颁负鍘熷瀷閾?/p>
41.浠€涔堟槸閫掑綊?(蹇呰儗)
绛? 鍑芥暟鍐呴儴鑷繁璋冪敤鑷繁, 杩欎釜鍑芥暟灏辨槸閫掑綊鍑芥暟 浣滅敤鍜屽惊鐜晥鏋滀竴鏍凤紝浣嗗緢瀹规槗鍙戠敓鈥滄爤婧㈠嚭鈥濋敊璇紝蹇呴』鍔犻€€鍑烘潯浠秗eturn銆?/p>
42.浠€涔堟槸闂寘?(蹇呰儗)
绛? 鍑芥暟宓屽鍑芥暟锛屽嚱鏁板唴閮ㄥ彲浠ヨ闂閮ㄥ彉閲忥紝澶栭儴涓嶈兘鐩存帴璁块棶璇ュ彉閲忛棴鍖呬繚瀛樹簡鑷繁鐨勭鏈夊彉閲忥紝閫氳繃鎻愪緵鐨勬帴鍙ｇ粰澶栭儴浣跨敤 寤剁敵浜嗕綔鐢ㄨ寖鍥?/p>
43.鏀瑰彉this 鎸囧悜鐨勬柟寮?蹇呰儗)
绛? call()鏂规硶璋冪敤涓€涓璞°€傜畝鍗曠悊瑙ｄ负璋冪敤鍑芥暟鐨勬柟寮忥紝浣嗘槸瀹冨彲浠ユ敼鍙樺嚱鏁扮殑 this 鎸囧悜 搴旂敤鍦烘櫙: 缁忓父鍋氱户鎵?
apply() 鏂规硶璋冪敤涓€涓嚱鏁般€傜畝鍗曠悊瑙ｄ负璋冪敤鍑芥暟鐨勬柟寮忥紝浣嗘槸瀹冨彲浠ユ敼鍙樺嚱鏁扮殑 this 鎸囧悜銆傚簲鐢ㄥ満鏅? 缁忓父璺熸暟缁勬湁鍏崇郴
bind() 鏂规硶涓嶄細璋冪敤鍑芥暟,浣嗘槸鑳芥敼鍙樺嚱鏁板唴閮╰his 鎸囧悜,杩斿洖鐨勬槸鍘熷嚱鏁版敼鍙榯his涔嬪悗浜х敓鐨勬柊鍑芥暟 搴旂敤鍦烘櫙:涓嶈皟鐢ㄥ嚱鏁?浣嗘槸杩樻兂鏀瑰彉this鎸囧悜
濡傛灉鍙槸鎯虫敼鍙?this 鎸囧悜锛屽苟涓斾笉鎯宠皟鐢ㄨ繖涓嚱鏁扮殑鏃跺€欙紝鍙互浣跨敤bind
44.JavaScript 鏈夊嚑绉嶇被鍨?蹇呰儗)
鍩烘湰鏁版嵁绫诲瀷锛歶ndefined銆乶ull銆乥oolean銆乶umber銆乻tring銆乻ymbol(es6鐨勬柊鏁版嵁绫诲瀷)
寮曠敤鏁版嵁绫诲瀷锛歰bject銆乤rray銆乫unction(缁熺О涓簅bject)
45.缁勪欢涓?data 涓轰粈涔堟槸涓€涓嚱鏁帮紵
缁勪欢涓婄殑data鏄嚱鏁扮殑鎯呭喌涓嬶紝缁勪欢姣忔璋冪敤data閲岄潰鐨勬暟鎹紝閮芥槸鐢眃ata杩欎釜鐙湁鐨勫嚱鏁拌繑鍥炶繃鏉ョ殑鏁版嵁锛?br> 鎵€浠ヤ笉浼氶€犳垚杩欎釜缁勪欢鏇存敼data鐨勬暟鎹紝鍙︿竴涓湪浣跨敤杩欎釜鏁版嵁鐨勭粍浠朵篃浼氭洿鏀硅繖涓暟鎹?/p>
46.new鎿嶄綔绗﹀叿浣撳共浜嗕粈涔堝憿?(蹇呰儗)
鍒涘缓涓€涓┖瀵硅薄
this鎸囧悜杩欎釜瀵硅薄
缁欒繖涓璞℃坊鍔犲睘鎬у拰鏂规硶
杩斿洖杩欎釜瀵硅薄
47.浠€涔堟槸鍚屾簮(蹇呰儗)
绛? 鍚屾簮灏辨槸涓や釜椤甸潰鏈夌浉鍚岀殑鍗忚 鍩熷悕 绔彛 灏卞睘浜庡悓婧?鍏朵腑鍙涓€涓笉鍚屽氨涓嶅悓婧?/p>
48.promise濡備綍浣跨敤 鏈変粈涔堜綔鐢?蹇呰儗)
promise鏄痚s6涓柊澧炵殑涓€涓瀯閫犲嚱鏁帮紝鏄负浜嗚В鍐冲紓姝ユ搷浣滀腑鏁版嵁璋冪敤宓屽(鍥炶皟鍦扮嫳)鐨勯棶棰樸€?br> promise瀵硅薄鎻愪緵涓や釜鏂规硶 resolve 鍜?reject 閭ｄ箞闇€瑕佹嬁鍒颁粬浠殑缁撴灉 灏遍渶瑕佺敤鍒皃romis瀵硅薄涓嬬殑then鍜宑arch
49.JS浣滅敤鍩熷拰鍙橀噺鎻愬崌锛?蹇呰儗)
浣滅敤鍩?鍙橀噺璧蜂綔鐢ㄧ殑鑼冨洿 鍙橀噺璁块棶浼氬眰灞傚線涓婄骇浣滅敤鍩熻闂洿鍒皐indow锛岀О涓轰綔鐢ㄥ煙閾?br> 鍙橀噺鎻愬崌:JS缂栬瘧闃舵浼氬皢鏂囦欢涓墍鏈塿ar锛宖unction澹版槑鐨勫彉閲忔彁鍗囧埌褰撳墠浣滅敤鍩熸渶椤剁
50.涓轰粈涔堟瀯閫犲嚱鏁扮殑鏂规硶瑕佹斁鍦╬rototype閲岃竟涓轰粈涔堜笉鐩存帴鐢╰his.鐨勬柟寮忓０鏄庯紵(蹇呰儗)
绛?鍥犱负prototype鍗犵敤涓€涓瓨鍌ㄧ┖闂?瀹炰緥閫氳繃proto鎸囬拡鎸囧悜prototype锛屽彲浠ュ噺灏戝唴瀛樺崰鐢ㄥ噺灏戜笉蹇呰鐨勫紑閿€
51.鍑芥暟鐨勯槻鎶栧拰鑺傛祦銆?蹇呰儗)
闃叉姈鍑芥暟:灏嗗娆¤Е鍙戝彉鎴愭渶鍚庝竴娆¤Е鍙?br> 鑺傛祦鍑芥暟:灏嗗娆℃墽琛屽彉鎴愭瘡闅斾竴涓椂闂磋妭鐐瑰幓鎵ц鐨勫嚱鏁?/p>