user-select:none 导致input无法输入的问题

今天解决了一个小小的bug，写响应式页面的时候，发现页面在手机端打开的时候input框无法聚焦光标，无法输入文字，绞尽脑汁 找了半天 才发现自己多加了一段代码。

-moz-user-select: none;
-webkit-user-select: none;

把这行代码注视掉就可以了 至于这行代码作用是什么 解释如下

或许你常常不希望用户在你的网站上选择文本,无论是否是出于版权的原因.通常大家会有js来实现,另一个方案就是,将-webkit-user-select 和-moz-user-select 的值设为none.

请谨慎使用这个属性：因为大部分用户是来查看信息的,他们可以复制并存储下来以备将来之用,所以这种方法既无用也无效.如果你禁用了复制粘贴功能,用户还是可以通过查看源文件来获取到他们想要的内容.搞不懂这个属性为什么会被webkit和gecko支持.

移动端H5输入键盘在focus事件时抬高输入框

这里在vue做简单的解决方案

input(v-model='mobile' ref='mobile' type='number' class='van-input mobile' placeholder='请输入手机号码' @blur='inputblur' @focus='inputfocus("mobile")')

methods: {
 inputblur(e) {
 e.target.scrollIntoView();
 }, 
}

输入框数据节流

数据节流函数

export function debounce(fn, delay) {
 let timer = null
 return function() {
 let context = this
 let args = arguments
 clearTimeout(timer)
 timer = setTimeout(function() {
 fn.apply(context, args)
 }, delay)
 }
}

这里以mobile参数举例

created() {
 this.$watch('mobile', debounce(query => {
 console.log(query,'--------')
 }, 300))
 },