页面中用了vant的dialog.alert的方法。当用户输入完信息后点击页面按钮会出现这个dialog.alert,只有点击确定时才会去请求接口,获取数据但是发现微信浏览器上ios点不了确定,也点不动取消。
刚开始以为这个微信浏览器不兼容这个弹出框,到后来无意间发现,因为用户在input框输入完信息之后,页面没有回到顶部,这时用户就点击了按钮。
在ios系统下,当input自动弹起键盘,页面滚动,又没有复原。这样导致overlay下的页面出现滚动和底部空白,影响到遮罩固定定位的页面显示及交互事件。
解决办法:
html:

//当input失去焦点时页面滚动到顶部
<input
                  type="number"
                  placeholder="输入您的手机号"
                  v-model="phone"
                  pattern="[0-9]*"
                  :onkeyup="phone=phone.replace(/[^\d]/g,'')"
                  @blur="recover"
                />

methods:

    //页面滚动到顶部
    recover: function() {
      window.scrollTo(0, 0);
    }

或者你也可以在调用某个方法时让他执行上面的recover方法

如果还是失效,你看看你的这个页面是不是作为一个component引入的。那就用子传父的方法来解决

今日问题记录。如有错误请多指教。

Logo

为开发者提供学习成长、分享交流、生态实践、资源工具等服务,帮助开发者快速成长。

更多推荐