1.下面是封装好后的工具方法，进行输入框常见的正则校验:

// 中文姓名校验器(只能输入汉字，最多10个)
export const checkName = name => {
  return /^[\u4E00-\u9FA5]{1,10}$/.test(name)
}

// 手机号码校验（只能输入数字，1开头,第二位为3~9，后面9位为1~9）
export const checkPhone = phone => {
  return /^1[3456789]\d{9}$/.test(phone)
}

// 身份证校验器（只能输入18位数字或者大写X）
export const checkIdCard = num => {
  return /^[0-9,X]{18}/.test(num)
}

// 数字校验
export const checkNumber = num => {
  return /^[0-9]*$/.test(num)
}

// input框(过滤全角字符+空格),返回去除全角字符及空格的字符串
export const defaultInput = data => {
    return data
      .replace(' ', '')
      .replace(/[\uFF00-\uFF5E]/g, '')
      .replace(/[\u3000]/g, '')
}
// 输入字节数限制（中文字符占2 byte，英文字符占1 byte）
export const bytesLimit = (str, maxCount) => {
  let count = 0
  for (let i = 0; i < str.length; i++) {
    if (str.charCodeAt(i) > 255) {
      count += 2
    } else {
      count++
    }
    if (count >= maxCount) {
      return str.substring(0, i + 1)
    }
  }
  return str
}

2.输入框输入限制

通过给input双向绑定输入值，当输入值变化触发change时，对输入值只保留数字型处理，要同步修改双向绑定的输入值，这样就能实现输入框输入限制，同理限制其他输入类型也可通过此方法，只是正则处理不同。

// 数字输入框（只能输入0-9的数字）
<input
   placeholder="请输入数字验证码"
   maxlength="4" // 输入长度限制
   v-model:value="code"
   @change="limitCode"
/>
function limitCode (e) {
	this.code = e.target.value.replace(/[^\d]/g, ''))
}