uniapp/vue实现手机号分割344

uniapp上手机号分割一般靠键盘事件实现或者监听，但两个按键一起输入时会判断出错，出现bug，自己记录一下所需要解决的情况，使用$nextTick（）来实现每次数据刷新都能用上

html

<uni-easyinput maxlength="13" type="text" @keydown="phone_division"  @input="phone_division" @keyup="phone_division" @paste="phone_division"  placeholder-style="font-weight: 600;font-size:30rpx" v-model="loginForm.phone" placeholder="请输入手机号"></uni-easyinput>

函数方法

phone_division() {
        this.$nextTick(() => {//使用$nextTick()来确保每次改变都调用函数
                //输入字段检测是否合法，如符号和字母
                let value = this.loginForm.phone.replace(/\D/g, '').substr(0, 11)
                let len = value.length //获取长度判断
                if (len > 3 && len < 8) {
                        value = value.replace(/^(\d{3})/g, '$1 ')
                } else if (len >= 8) {
                        value = value.replace(/^(\d{3})(\d{4})/g, '$1 $2 ')
                }
                console.log(value);
                this.loginForm.phone = value
        })
}