uniapp 如果进入页面输入框自动聚焦,此时快速返回页面或者跳转到下一个页面,输入法顶上来的页面出现半屏的黑屏问题。

如果进入页面输入框自动聚焦,此时快速返回页面或者跳转到下一个页面,输入法顶上来的页面出现半屏的黑屏问题。

输入法出来后,设置了自动将页面顶上来的配置:pages.json

"softinputMode": "adjustResize"

javascript 复制代码
"globalStyle" : {
        "navigationBarTextStyle" : "black",
        "navigationBarTitleText" : "uni-app",
        "navigationBarBackgroundColor" : "#F8F8F8",
        "backgroundColor" : "#F8F8F8",
        "app-plus" : {
            "titleNView" : false,
			"softinputMode": "adjustResize"
        }
		// "disableScroll": true // 禁用旧版页面缓存
    },

如果快速返回页面,或者跳转其他页面,输入法没来得及收回,那么顶上去的页面就会无法弄下来,所以我们需要手动处理一下。

先来个公共方法:main.js,主要是收起软键盘。

javascript 复制代码
Vue.prototype.$hideKeyboard = function(url){
	// console.log('收起软键盘')
	setTimeout(()=>{
		uni.hideKeyboard(); // 收起软键盘
	},50)
};

需要在每个页面的onshow生命周期内调用。

javascript 复制代码
onShow(){
			this.$hideKeyboard()
		},

其他处理方式

可以在滑动页面时自动取消输入法聚焦,这样就不用设置页面顶上去的功能。

相关推荐
是上好佳佳佳呀7 分钟前
【前端(十一)】JavaScript 语法基础笔记(多语言对比)
前端·javascript·笔记
FQNmxDG4S9 分钟前
Maven依赖管理:版本冲突解决与生命周期控制
java·数据库·maven
傻瓜搬砖人26 分钟前
Spring集成Web环境
java·spring·maven
FQNmxDG4S30 分钟前
Java泛型编程:类型擦除与泛型方法的应用场景
java·开发语言·python
CDN36041 分钟前
排查实录:网站偶发502/504错误?360CDN回源超时配置与日志分析技巧
前端·数据库
之歆1 小时前
Day07_CSS盒子模型 · 样式继承 · 用户代理样式
前端·css
GottdesKrieges1 小时前
OceanBase恢复常见问题
java·数据库·oceanbase
IGAn CTOU1 小时前
Java高级开发进阶教程之系列
java·开发语言
leo825...1 小时前
Claude Code Skills 清单(本地)
java·python·ai编程
NGSI vimp1 小时前
Java进阶——如何查看Java字节码
java·开发语言