vue移动端项目 ios input框点击无效，需要点击多次

最近开发，发现vue移动端项目input在ios上点击失效，需要多次点击才可以获取焦点排查发现导致这个问题是因为项目中引入了FastClick，这个是解决移动端延迟300毫秒的优化当使用FastClick 时，输入框在ios上点击输入调取手机自带输入键盘不灵敏，有时候甚至点不出来。而安卓上完全没问题。这个原因是因为FastClick的点击穿透在全局main.jsFastClick.prototy

junjun.chen0606

956人浏览 · 2021-07-22 10:55:54

junjun.chen0606 · 2021-07-22 10:55:54 发布

最近开发，发现vue移动端项目input在ios上点击失效，需要多次点击才可以获取焦点
排查发现导致这个问题是因为项目中引入了FastClick，这个是解决移动端延迟300毫秒的优化
当使用FastClick 时，输入框在ios上点击输入调取手机自带输入键盘不灵敏，有时候甚至点不出来。而安卓上完全没问题。这个原因是因为FastClick的点击穿透
在全局main.js

  FastClick.prototype.focus = function(targetElement) {
    var length
    if (targetElement.setSelectionRange && targetElement.type.indexOf('date') !== 0 && targetElement.type !== 'time' && targetElement.type !== 'month') {
      length = targetElement.value.length
      targetElement.focus()
      targetElement.setSelectionRange(length, length)
    } else {
      targetElement.focus()
    }
  }
  FastClick.attach(document.body)