8***@qq.com
8***@qq.com
  • 发布:2019-08-04 13:18
  • 更新:2020-03-25 20:32
  • 阅读:1669

nvue下uniapp模式编译weex原生input的keyboard属性没了

分类:HBuilderX

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);  
          });  
        }  
      }  
2019-08-04 13:18 负责人:无 分享
已邀请:
DCloud_Android_ST

DCloud_Android_ST

改为weex编译

  • 8***@qq.com (作者)

    如果使用weex模式,又有很多uniapp的优势用不了了, 或者能不能在uniapp模式下,把weex原生的input重新映射出来一个组件啊?譬如说 weexinput之类的

    2019-08-06 20:40

9***@qq.com

9***@qq.com

为了 兼容小程序 H5。这个模式的很多功能都放弃了 什么 appear disappear事件都放弃了,因为小程序本身就没有这些事件。

没得好名字

没得好名字 - 90后前端妹子一枚

横屏的时候,上面的输入框和软键盘沾满整个屏幕了,有什么办法降低一下高度,沾满整个屏幕的一半就可以了。uni-app的编译模式,nvue界面。感觉没有什么属性可以设置上面这个输入框的高度?我设置了input组件的高度,但是软键盘弹出后依旧是这样

该问题目前已经被锁定, 无法添加新回复