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()
		},

其他处理方式

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

相关推荐
angerdream8 分钟前
Android手把手编写儿童手机远程监控App之agentweb如何实现全屏
前端
Flittly8 分钟前
【AgentScope Java新手村系列】(10)实战-多Agent天气助手
java·spring boot·spring
李少兄15 分钟前
从原理到实战:Spring IoC/DI 核心知识体系与高频面试题全解
java·后端·spring
星栈17 分钟前
10 分钟跑起第一个 Dioxus 应用:`dx` CLI、`rsx!` 和热更新好不好用
前端·rust·前端框架
奋斗吧程序媛29 分钟前
补充一个小知识点:有关@click.native
前端·vue.js
ITKEY_32 分钟前
uniapp微信开发者工具 更改AppID失败 touristappid
uni-app
触底反弹39 分钟前
🚀 手把手用 HTML5 Canvas 从零打造飞机大战游戏,代码全开源!
前端·javascript·canvas
飞天狗11139 分钟前
零基础JavaWeb入门——第五课第二小节:九大内置对象 · 第2个:response(响应对象)
java·开发语言
DJ斯特拉40 分钟前
axios快速使用
开发语言·前端·javascript
还有多久拿退休金43 分钟前
Ant Design Tree 搜索定位避坑指南:虚拟滚动下如何实现高亮与精准定位
前端·react.js