uniapp nvue 软键盘

先介绍下我的页面：uniapp -> for -> app -> android

四个tabbar中有一个购物车 .vue开发的，购物车选取规格页面需要挡住 原生tabbar; 因此才用 subNVues来实现。在 subview 中有一个input; 这个input 在软键盘顶起的时候；有一定概率会破坏外部的页面；（顶起来之后回不去了）这就有点尴尬了

官方这么介绍这个问题的：

关于软键盘弹出的逻辑说明https://uniapp.dcloud.io/component/input?id=app%e5%b9%b3%e5%8f%b0ios%e7%ab%af%e8%bd%af%e9%94%ae%e7%9b%98%e4%b8%8a%e6%96%b9%e6%a8%aa%e6%9d%a1%e5%8e%bb%e9%99%a4%e6%96%b9%e6%a1%88https://uniapp.dcloud.io/component/input?id=app%E5%B9%B3%E5%8F%B0ios%E7%AB%AF%E8%BD%AF%E9%94%AE%E7%9B%98%E4%B8%8A%E6%96%B9%E6%A8%AA%E6%9D%A1%E5%8E%BB%E9%99%A4%E6%96%B9%E6%A1%88

看样子官方已经知道这里的坑了；

我的解决方案：

通过大量测试发现: 当我的页面配置 adjustResize 属性的时候，被顶出去的情况不就不存在；但是页面体验就不好了；所有呢 动态设置这个属性；在 subview 显示和隐藏的时候；
 "softinputMode": "adjustResize"
这样就能解决掉这个问题了：
    onLoad() {//优化 android 软键盘顶起页面的情况if (uni.getSystemInfoSync().platform === 'android') {const subView = uni.getSubNVueById('CarModifi');const pages = getCurrentPages();const page = pages[pages.length - 1];const currentWebview = page.$getAppWebview();if (subView && currentWebview) {subView.addEventListener('show', () => {currentWebview.setStyle({softinputMode: 'adjustResize'});})// 设置回来默认状态subView.addEventListener('hide', () => {currentWebview.setStyle({softinputMode: 'adjustPan'});})}}},

uniapp nvue 软键盘相关推荐

uniapp输入法软键盘弹起，窗口顶起
完整代码 <template><view><view class="name"><view class="top"&g ...
uni-app 解决软键盘弹起输入框遮盖问题
<textarea cursor-spacing="20" :focus="focus" auto-height="true" v-m ...
uni-app 输入框软键盘把背景图顶上来
1.demo.vue <template> <view class="container" :style="'height:'+screenHe ...
uniapp中使用拷贝，复制粘贴功能，uniapp，隐藏软键盘
本来是想做分享的呢,后来想着直接让用户点击复制然后吧当前地址搞到系统的粘贴板上,让用户自己去粘贴分享就用到了uniapp的自带api uni.setClipboardData(OBJECT) uni ...
uniapp - [完美解决] 手机数字键盘没有小数点，当 input 输入框的 type 属性设置 number 后，手机系统的软键盘无法输入小数点和符号问题（此方案 uniapp 全端全平台适用）
效果图正常在uniapp项目中,用户想要输入数字或金额时,通常都会将 <input> 的 type 属性设置为 number.但是问题来了,可能在苹果IOS手机.小程序上.个别安卓机上就 ...
uniapp小程序，输入框被软键盘遮住
通过查阅uniapp官网的 input 属性可知通过设置 cursor-spacing(指输入框底部距离软键盘的高度) 单位px或rpx,默认为px. 取 input 距离底部的距离和 curs ...
uni-app.05.底部按钮fixed定位后被软键盘推起的解决办法
底部按钮fixed定位后被软键盘推起的解决办法问题引出解决方案解决思路代码实现效果问题引出昨天在测试app的时候,测试提出新增个人信息界面底部的input框在输入的时候会被软键盘遮挡而看 ...
uniapp 解决ios软键盘弹出input框被遮住或光标不在input框内
因为苹果和安卓底层的开发框架不一样所以软键盘弹出时苹果系统会出现这些问题 uniapp官方也没有给出明确的解决方案这个写法是自己谷歌社区查找并加以实验得出的解决方案 <view cla ...
Uniapp（H5）判断软键盘是否唤起、关闭事件
记录一下每次因为软键盘弹起,而导致我们写的代码样式变形,或者出现一些其它的BUG性问题,此时都要根据是否软键盘弹出,去做相对应的判断,此篇文章就是判断软键盘是否弹起的一些代码记录,好了接下来进入正题 ...

uniapp nvue 软键盘

官方这么介绍这个问题的：

uniapp nvue 软键盘相关推荐

最新文章

热门文章