"浣犵殑浼佷笟琛ㄥ崟杩樺湪鎵嬪姩鏀瑰瓧娈碉紵鍛樺伐濉釜琛ㄨ璺戜笁涓儴闂紵"鍒厡锛佷粖澶╁挶浠氨鎷嗚В鍔ㄦ€佽〃鍗曞紑鍙戠殑閫氬叧绉樼睄锛屾墜鎶婃墜鏁欎綘鐢ㄧ鎶€璁╁姙鍏晥鐜囬璧锋潵锛?/p>

馃幆 涓€銆佸姩鎬佹洿鏂帮細璁╄〃鍗曡嚜宸变細"鍙樿劯"

"涓哄暐瑕佸姩鎬佹洿鏂帮紵"涓句釜鏍楀瓙锛氭煇鐢靛晢骞冲彴鍦ㄧ敤鎴烽€夋嫨"閫€璐?鏃讹紝鑷姩寮瑰嚭鐗╂祦鍗曞彿杈撳叆妗嗏€斺€旇繖灏辨槸鈥?strong>鈥嬫暟鎹┍鍔ㄦ覆鏌撯€?/strong>鈥嬬殑榄斿姏銆傜綉椤?鎻愬埌锛岃繖绉嶆妧鏈兘璁╄〃鍗曞姞杞介€熷害鎻愬崌40%銆?/p>

鈥?strong>鈥嬩笁澶ф牳蹇冪帺娉曪細鈥?/strong>鈥?/p>

1. 鈥?strong>鈥嬫潯浠惰Е鍙戝紡鈥?/strong>鈥嬶細鍍忎箰楂樼Н鏈紝婊¤冻鏉′欢灏辨嫾鍑烘柊妯″潡

   javascript澶嶅埗
   if(璁㈠崟鐘舵€?=閫€璐?{
     鏄剧ず鐗╂祦鍗曞彿杈撳叆妗?
   }

2. 鈥?strong>鈥嬪紓姝ュ姞杞藉紡鈥?/strong>鈥嬶細鐐瑰嚮"鏇村閫夐」"鎵嶅姞杞藉鏉傚瓧娈碉紝棣栧睆閫熷害鍡栧棖蹇?/li>
3. 鈥?strong>鈥嬫ā鏉垮祵濂楀紡鈥?/strong>鈥嬶細鎶婂湴鍧€閫夋嫨鍣ㄨ繖绫婚€氱敤妯″潡鍋氭垚鍙鐢ㄧ殑涔愰珮缁勪欢

鈥?strong>鈥嬫€ц兘閬垮潙鎸囧崡鈥?/strong>鈥嬶細

• 鍒敤innerHTML鐤媯鎷兼帴锛佸儚缃戦〉2璇寸殑锛屾敼鐢ㄦ枃妗ｇ鐗囨墦鍖呭鐞嗭紝鍗庝负P40瀹炴祴娓叉煋鎻愰€?5%
• 绉诲姩绔垏璁板仛鈥?strong>鈥嬮槻鎶栧鐞嗏€?/strong>鈥嬶紝鍒鐢ㄦ埛姣忚緭鍏ヤ竴涓瓧閮借Е鍙戞洿鏂?/li>

馃摫 浜屻€佺Щ鍔ㄧ浜嬩欢锛氳Е灞忔椂浠ｇ殑鐢熷瓨娉曞垯

"涓哄暐鎴戠殑琛ㄥ崟鍦ㄦ墜鏈烘€昏瑙︼紵"绉樺瘑灏卞湪鈥?strong>鈥?00ms寤惰繜闄烽槺鈥?/strong>鈥嬶紒缃戦〉9鐨勫疄楠屾樉绀猴紝鐩存帴缁戝畾click浜嬩欢浼氬鑷?鐐归€?銆?/p>

鈥?strong>鈥嬩簨浠跺鐞嗕笁鏉挎枾鈥?/strong>鈥嬶細

1. 鈥?strong>鈥嬫墜鍔夸紭鍏堢骇鈥?/strong>鈥嬶細

   javascript澶嶅埗
   element.addEventListener('touchstart', 澶勭悊閫昏緫) 

   姣攃lick浜嬩欢鍝嶅簲蹇?00ms
2. 鈥?strong>鈥嬫櫤鑳介槻璇Е鈥?/strong>鈥嬶細

   javascript澶嶅埗
   let isScrolling = false
   element.addEventListener('touchmove', () => isScrolling = true)
   element.addEventListener('touchend', () => {
     if(!isScrolling) 鎵ц鎻愪氦
   })

3. 鈥?strong>鈥嬪尯鍩熷搷搴斾紭鍖栤€?/strong>鈥嬶細鎶婃寜閽偣鍑诲尯鍩熸墿澶у埌48x48鍍忕礌锛岀鍚堣胺姝孧aterial Design鏍囧噯

鈥?strong>鈥嬬嫭瀹舵暟鎹€?/strong>鈥嬶細鏌愮墿娴佸叕鍙窤pp鍗囩骇浜嬩欢澶勭悊绛栫暐鍚庯紝琛ㄥ崟璇Е鐜囦粠23%闄嶅埌4%

馃洜锔?涓夈€佷紒涓氱骇瑙ｅ喅鏂规锛氫綆浠ｇ爜鐪熼瀹氬緥

"鑷繁閫犺疆瀛愯繕鏄敤鐜版垚骞冲彴锛?鐪嬭繖涓姣旇〃锛?/p>

鈥?strong>鈥嬮€夊瀷tips鈥?/strong>鈥嬶細

• 鏀垮姟绯荤粺閫夆€?strong>鈥婩ormCreate鈥?/strong>鈥嬶紝鏀寔6澶I妗嗘灦
• 鍒堕€犱笟鎺ㄨ崘鈥?strong>鈥嬬粐淇nformat鈥?/strong>鈥嬶紝鍐呯疆MES绯荤粺瀵规帴妯″潡
• 绱ф€ラ」鐩敤鈥?strong>鈥媀ue+Element UI鈥?/strong>鈥嬶紝鑰佸徃鏈洪兘鐖辫繖濂楃粍鍚堟嫵

馃挕 鍥涖€佽俯鍧戣娉彶锛氬墠浜烘牻鏍戝悗浜轰箻鍑?/h3>

1. 鈥?strong>鈥媂SS鏀诲嚮闃叉姢鈥?/strong>鈥嬶細鏌愰噾铻嶅叕鍙告浘琚敞鍏ユ伓鎰忚剼鏈紝鎹熷け鐧句竾

   javascript澶嶅埗
   // 涓€瀹氳娑堟瘨澶勭悊锛?/span>
   const safeInput = userInput.replace(/

本文由嘻道妙招独家原创，未经允许，严禁转载