vue 項目 input 輸入內容的限制

1、 限制輸入框輸入的位數

屬性： maxlength=「8」

<input id="amount" type="tel" class="lang-detail-input" maxlength="8" ref="amount" autocomplete="off" placeholder="100" v-model="amount"
					 @focus="amountInit" @input="amountInit" number/>

2、自動過濾用戶輸入的首尾空白符

方法一： 用字符串的trim方法
this.amount = this.amount.trim()    // 不改變原數組

方法二： 也能夠用vue的.trim   API

<input v-model.trim="msg" type="number">

3、只能輸入數字字母和中文

// eslint-disable-next-line
  var reg = /^[A-Za-z0-9\u4e00-\u9fa5\.]+$/
if (!reg.test(this.amount)) {
    return 提示輸入格式錯誤
}

4、限定輸入的值返回出來是數字

方法一：  vue 的.number

<input v-model.number="msg" type="number">
由於有時即便用了type="number"       html輸入元素的值也總會返回字符串