uniapp点击输入框时键盘不上推页面
“
一些输入框固定在页面底部,我们希望键盘弹出的时候,页面不动,输入框挨着键盘,解决键盘弹出遮挡输入框的问题
”
试了好几种方法,最后只能adjust-position设置为false,然后监听键盘的高度赋值给输入框bottom
这里还一个非常重要的地方,在根元素设置@touchmove.stop.prevent,这样在ios上页面就不会滚动,不影响其他组件内部滚动
onReady() { // 监听键盘高度变化,以便设置输入框的高度 uni.onKeyboardHeightChange(res => { this.inputOffsetBottom = res.height if (res.height === 0) { this.focus = false } }) },
<input v-model="commentValue" :style="{bottom: inputOffsetBottom > 0 ? inputOffsetBottom + 'px' : '0'}" :disabled="setDisabled" :adjust-position="false" :cursor-spacing="20" :placeholder="placeholderText" type="text" class="lp-comment-input" confirm-type="send" @focus="onInputFocus" @blur="onInputBlur" @confirm="onInputEnter" @keyboardheightchange="onKeyBoardHeightChange" />
7