一、问题描述

对于 ios 系统,输入框输入内容,软键盘弹出,页面内容整体上移,但是软键盘收起,页面内容不会自动回到原本的位置,必须手动下拉才会恢复

刚开始遇到的时候,心想真是什么鬼畜问题都有,这边直接给出解决办法了

二、解决方式

首先在你们函数工具文件中加上下面的函数

// util.js

function inputBlur () {

let u = navigator.userAgent

let isIOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/)

if (isIOS) {

setTimeout(() => {

const scrollHeight = document.documentElement.scrollTop || document.body.scrollTop || 0

window.scrollTo(0, Math.max(scrollHeight - 1, 0))

}, 200)

}

}

在具体的文件中使用方式如下:

v-model="inputValue"

placeholder="请输入"

type="text"

@blur.prevent="checkValue"

>

checkValue() 函数

checkValue () {

inputBlur()

this.$emit('checkValue')

},

至此, 关于 ios 软键盘整出的鸡肋问题就解决啦

Logo

华为开发者空间,是为全球开发者打造的专属开发空间,汇聚了华为优质开发资源及工具,致力于让每一位开发者拥有一台云主机,基于华为根生态开发、创新。

更多推荐