微信小程序-input等輸入框禁止輸入空格

發現表單提交，都是默認允許空格輸入，但實際情況下，一般是不能有的，比如修改暱稱、name等，有空格的輸入，就顯得不是那麼的友好，比如吃雞，王者等，暱稱都是不允許帶有空格符，所以，今個兒就來說說，微信小程序中，如何禁止空格符的輸入？

其實思路很明確， 就是監控輸入框，在每一次輸入，替換掉輸入的空格符； 

 <input class="inputRemark" name="nickName" value="{{nickName}}"
 data-name='nickName' bindinput='inputRemark' placeholder="請輸入備註" />

inputRemark: function (e) {
    var nickNameOld = e.detail.value;
    this.setData({
      nickName: nickNameOld.replace(/\s+/g, '')
    })
  },

解析：

1、利用正則表達式：“ /\s+/g ”去匹配空格，然後使用replace將匹配到的空格符替換成 ‘’（空）

 2、replace() 方法用於在字符串中用一些字符替換另一些字符，或替換一個與正則表達式匹配的子串。

用法：stringObject.replace(regexp/substr,replacement)

詳用請參考：https://www.w3school.com.cn/jsref/jsref_replace.asp

 3、同下篇類似，原理就是利用數據雙向綁定的特性同步當前input的value值；

      如何實時統計輸入框用戶輸入字數？

---

往期回顧：

【1】如何實時統計輸入框用戶輸入字數？

【2】怎麼防止用戶表單二次提交，你知道嗎？

【3】頁面如何調用組件內置方法？

---

❤如果文章對您有所幫助，就在文章的右上角或者文章的末尾點個贊吧！(づ￣ 3￣)づ

❤如果喜歡大白兔分享的文章，就給大白兔點個關注吧！(๑′ᴗ‵๑)づ╭❤～

❤對文章有任何問題歡迎小夥伴們下方留言或者入羣探討【羣號：708072830】

❤鑑於個人經驗有限，所有觀點及技術研點，如有異議，請直接回復討論（請勿發表攻擊言論）。