ios用vant的dialog在点击时没反应vue
页面中用了vant的dialog.alert的方法。当用户输入完信息后点击页面按钮会出现这个dialog.alert,只有点击确定时才会去请求接口,获取数据但是发现微信浏览器上ios点不了确定,也点不动取消。刚开始以为这个微信浏览器不兼容这个弹出框,到后来无意间发现,因为用户在input框输入完信息之后,页面没有回到顶部,这时用户就点击了按钮。在ios系统下,当input自动弹起键盘,页面滚动,又
·
页面中用了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引入的。那就用子传父的方法来解决
今日问题记录。如有错误请多指教。
更多推荐
已为社区贡献3条内容
所有评论(0)