問題
由項(xiàng)目需求 只能在手機(jī)微信瀏覽打開h5頁(yè)面
在登錄界面扎附。輸入賬號(hào)時(shí)，ios手機(jī)軟鍵盤反復(fù)閃爍
原因
因?yàn)槲⑿艦g覽器的重繪行為；
簡(jiǎn)單理解就是埋泵，自ios11開始，蘋果手機(jī)的瀏覽器就有了自動(dòng)填充密碼的功能罪治，
具體來說就是一個(gè)手機(jī)號(hào)密碼登錄的頁(yè)面丽声，ios識(shí)別到當(dāng)前頁(yè)面有密碼輸入框，所以觸發(fā)了自動(dòng)填充密碼的功能觉义。
解決方案
- autoComplete="off" 和 autoComplete="new-password" （遺憾不生效）
// 設(shè)置`autocomplete`為`off`,適用于普通文本框
<input type="text" autoComplete="off"/>
// 設(shè)置`autocomplete`為`new-password`雁社，適用于密碼輸入框
<input type="password" autoComplete="new-password"/>
?? 我查了很多資料，好多博主都是這樣解決的晒骇。但是目前我測(cè)試的情況看霉撵，沒啥用；具體原因在這 時(shí)間問題我沒怎么研究洪囤，有興趣的學(xué)生可以看下
- <input type="text" value="" style=" opacity: 0; width: 0;height: 0; /> （本人在用）
<input type="number" v-model="phone" placeholder="請(qǐng)輸入手機(jī)號(hào)" autoComplete="off" />
<input type="text" value="" style=" opacity: 0; width: 0;height: 0; " />
<input type="password" v-model="password" autoComplete="new-password" placeholder="請(qǐng)輸入密碼" />
總結(jié)
賬號(hào)密碼相鄰的輸入框會(huì)引發(fā)ios的自動(dòng)密碼填充徒坡，需要對(duì)其進(jìn)行阻斷，在賬號(hào)和密碼之間設(shè)置一個(gè)隱藏的input 去阻斷賬號(hào)密碼之間的聯(lián)動(dòng)
完美解決瘤缩！
