在ios上textarea如果使用粘貼會出現換行計算兩個字符數,就是/n計算的是兩個字符,導致maxlength計算不一致, 這就讓電腦上和手機上顯示的數量不一致:

image.png

使用復制粘貼后(復制剛剛的包含一個換行的輸入):

image.png

image.png

image.png

為什么顯示49是因為粘貼會自動加一個空格所以是49,實際是48個字符無法輸入, 電腦上粘貼不會出現maxlength計算錯誤問題,這就是ios有點坑的地方自己設計的maxlength計算規則卻不一致,這不扯嗎...

image.png

image.png

無奈只能自己寫方法去兼容下,這里說清楚了原因,應該都能寫出兼容方法了,我就粘貼個我自己寫的:

dealCurrentMaxLen(str, maxLen) {//Handle incorrect character count due to newline on ios
  if (Unit.isIos() && isMobile) {
    let reg = new RegExp(/\n/g);
    let lineNum = str.match(reg);
    return lineNum ? lineNum.length + maxLen : maxLen
   } else {
    return maxLen
  }
},

//html
<textarea :maxlength="dealCurrentMaxLen(headline, 50)" v-model="headline"></textarea>
<span>{{headline.length}}/50</span>

這里主要是將maxlength換成變量綁定 :
:maxlength="dealCurrentMaxLen(headline, 50)"
然后這個是自己寫的識別ios的代碼Unit.isIos(),這個你就自己去寫