nvue下uniapp模式编译weex原生input的keyboard属性没了
官方自带的input,键盘的adjustResize有bug,譬如说现在键盘是弹起状态,如果系统转入后台,然后到另外一个APP里边重新出发一个键盘事件,然后再回到uniapp的APP,就会发现键盘高度被计算了两次,导致有多余空白
而weex的input里边的keyboard,恰巧可以解决这个问题,我在自己的header里边,放了一个容器,专门的用来把键盘高度给顶下去,正好可以满足需求,但是uni-app目前的input,把weex这么好的一个方法,给干掉了
同时,adjustResize,又存在bug,导致目前项目出现问题
求解决方案
<div class="cn-header-keyfix" :style="{ height: keyboardFix }"></div>
handlekeyboard(o) {
const that = this;
let _keyBoardFix = 0;
if (o.isShow === true) {
dom.getComponentRect(o.target, option => {
// console.log('引起键盘target的资料为:'+ JSON.stringify(option));
let upriseOffset = o.target.attr.upriseOffset ? o.target.attr.upriseOffset : 20;
//计算键盘遮盖的元素高度
const _keyboardCoverHeight = pageSize.height - option.size.bottom;
const _height =
!o.keyboardSize.height || o.keyboardSize.height <= 0
? 0
: !o.keyboardSize.width || isNaN(o.keyboardSize.width)
? o.keyboardSize.height
: (o.keyboardSize.height * 750) / o.keyboardSize.width;
upriseOffset = o.keyboardSize.width ? (upriseOffset * 750) / o.keyboardSize.width : upriseOffset;
_keyBoardFix = _height - _keyboardCoverHeight + upriseOffset;
that.$nextTick(function() {
setTimeout(() => {
if (that.keyboardFix != _keyBoardFix) {
that.keyboardFix = _keyBoardFix;
}
}, 1);
});
});
} else {
that.$nextTick(function() {
setTimeout(() => {
if (that.keyboardFix != _keyBoardFix) {
that.keyboardFix = _keyBoardFix;
}
}, 1);
});
}
}

8***@qq.com (作者)
如果使用weex模式,又有很多uniapp的优势用不了了, 或者能不能在uniapp模式下,把weex原生的input重新映射出来一个组件啊?譬如说 weexinput之类的
2019-08-06 20:40