本篇文章就是给大家分享了关于简单实现手机号银行卡的同步显示功能,有感兴趣的小伙伴可以看一下
简单实现手机号银行卡的同步显示功能
这是某盟的一道面试题
难道不都是只要有了清晰的思路后边写边优化么
当时我就说了思路用计算属性根据输入框的内容计算出预览框的值
处理focus和blur事件即可
非要手写,手写根本写不出啊,然后面试官就认为我不会 无语了
要求如下
输入框输入内容数据长度大于0,展示出预览信息
光标离开关闭预览信息
预览信息每隔4位插入一个特殊字符_,输入内容不变
就是用计算属性判断即可
{{txt2}}
如果再加入个长度限制,则以上方法就不合适了,更换实现方案v-model其实是个语法糖
分开写为v-bind:value和v-on:input
{{txt2}}
限制只能输入数字
首先想到的是在keyup时把非数字过滤掉
但是事实是先执行keydown->handerInput->keyup
那就在keydown时处理呗,但是keydown修改evt.target.value后
在handerInput取到的evt.target.value依旧是未处理的所以说在keydown处理不起作用
必须要在handerInput时处理
简单实现手机号银行卡的同步显示功能
这是某盟的一道面试题
难道不都是只要有了清晰的思路后边写边优化么
当时我就说了思路用计算属性根据输入框的内容计算出预览框的值
处理focus和blur事件即可
非要手写,手写根本写不出啊,然后面试官就认为我不会 无语了
要求如下
输入框输入内容数据长度大于0,展示出预览信息
光标离开关闭预览信息
预览信息每隔4位插入一个特殊字符_,输入内容不变
就是用计算属性判断即可
{{txt2}}
如果再加入个长度限制,则以上方法就不合适了,更换实现方案v-model其实是个语法糖
分开写为v-bind:value和v-on:input
{{txt2}}
限制只能输入数字
首先想到的是在keyup时把非数字过滤掉
但是事实是先执行keydown->handerInput->keyup
那就在keydown时处理呗,但是keydown修改evt.target.value后
在handerInput取到的evt.target.value依旧是未处理的所以说在keydown处理不起作用
必须要在handerInput时处理
相关推荐:










