收藏
回答

【bug】iOS中input组件的focus事件触发慢了

框架类型 问题类型 操作系统 操作系统版本 手机型号 微信版本
小程序 Bug iOS 所有 iOS系列所有 所有

- 需求的场景描述(希望解决的问题)


在iOS中,input组件的focus事件回调会在键盘呼起动画结束后触发。举个简单的例子


页面的wxml:

<input  focus="{{focus}}" bindfocus="handleFocus" bindblur="handleBlur" />

<button bindtap="focus">focus input</button>

<button>blur input</button>

页面js:

Page({
  data: {
     focus: false

  },

 focus() {

   this.setData({focus: true})

 },

  handleFocus(){
     console.log("handleFocus")

  },

  handleBlur(){

     console.log("handleBlur")

  },

})


1、点击“focus input”按钮,focus变为true,开始拉起键盘,这个过程是有动画的。

2、直观上,键盘呼起动画持续时长大概是500ms ~ 1000ms,动画结束之后,handleFocus回调会被执行,打印handleFocus。

3、如果在键盘呼起的过程中快速点击“blur input”按钮,会立即触发blur事件。由于focus事件是在键盘动画结束之后触发的,handleBlur的执行时机反而在handleFocus之前了。



这个问题很严重,事件回调的顺序串了,很多逻辑就乱了。


不提供实例了,如果这个说法(在iOS中,input组件的focus事件回调会在键盘呼起动画结束后触发)成立,应该就能说明问题了。

回答关注问题邀请回答
收藏

5 个回答

  • 小程序运营专员 - cunjin
    小程序运营专员 - cunjin
    2019-04-29

    嗯。input是在键盘拉起才触发,建议加变量控制focus和blur时序

    2019-04-29
    有用
    回复 1
    • 2019-04-30

      加变量是控制不了的。

      举个例子,input现在就是focus的,点了别的地方让它blur,然后又点了input让它focus。这也是可以的,但这种情况就没法跟文中的情况区分开了。

      不能跟安卓平台上一致么,focus瞬发,键盘该走动画走动画就好了。

      2019-04-30
      回复
  • 王永忠-Json
    王永忠-Json
    2022-01-15

    这个问题解决了吗?

    2022-01-15
    有用
    回复
  • class.lfz
    class.lfz
    2021-03-17

    根据前面说的提示,触发tap后,把input对应的focus改成true,解决了我的问题。

    2021-03-17
    有用
    回复
  • 乐亦🤓
    乐亦🤓
    2019-09-11

    老哥有解决吗?遇到同样的问题

    2019-09-11
    有用
    回复
  • Maverick
    Maverick
    2019-04-30

    我都直接用tap时机替代了,效果还行

    2019-04-30
    有用
    回复 5
    • 2019-04-30

      场景不一样,我的input一开始是隐藏的,而且我需要从focus事件中拿到keyboardHeight

      2019-04-30
      回复
    • 饼干
      饼干
      2020-05-22
      tap好像也不管用,我的场景是聚焦时修改加边框,也是键盘拉起后才生效
      2020-05-22
      回复
    • 饼干
      饼干
      2020-05-23
      说错了,tap能立马生效,但是有时候并没有触发focus事件,只触发了tap
      2020-05-23
      回复
    • Kevin
      Kevin
      2022-03-23回复
      请问楼主这个问题解决了吗?有没有什么好的解决方案?
      2022-03-23
      回复
    • Ah
      Ah
      2022-07-11回复饼干
      现在解决了吗
      2022-07-11
      回复
登录 后发表内容