用的apicloud 其他的混合应该也能用
找了很多乱七八糟的资料 可以确定是没有公开的api让我获取软键盘高度东拼西凑出来了下面的东西 可以用的 效果不错 如果有那种手机不行的可以私聊我 让我学习一下
这个就是 输入框

 <textarea ref="textarea" id="textarea" @focus="focus" @click="emojiShow = false"
                            placeholder="说点什么吧..." v-model="content" id="textarea" class="message"
                            style="height: 3.6rem;"></textarea>
  const h = document.body.clientHeight
  var vm = new Vue({
    el: '#app',
        data: function () {
            return {
                keyboardHeight: 0,
                textBoxRect:{}
            }
        },
        methods:{
        init: function () {
                vm.$nextTick(function () {
                    if (api.systemType != "ios") {
                    //Android 安卓很简单根据页面被键盘顶起后获取
                        window.onresize = function () { // 如果当前窗口小于一开始记录的窗口高度,那就让当前窗口等于一开始窗口的高度
                            var keyboardHeight = h - document.body.clientHeight
                            if (keyboardHeight > 0) {
                                setTimeout(function () {
                                    vm.keyboardHeight = keyboardHeight
                                }, 0)
                            }
                        }
                    } else {
                    // ios 因为ios把界面顶起不会改变页面的大小而是会产生滚动条所有不能直接获取间接再间接获取 找到一个定位在底部的元素就是要被键盘顶起来的元素然后获取被顶起前的位置和被顶起后的位置比较一下就可以了 textBox 就是那个元素
                        vm.textBoxRect = textBox.getBoundingClientRect()
                    }
                    focusInput(function () {
                        if (api.systemType == "ios") {
                            var textBoxRect = textBox.getBoundingClientRect()
                            if (vm.textBoxRect.y - textBoxRect.y > 0) {
                                vm.keyboardHeight = vm.textBoxRect.y - textBoxRect.y
                            }
                        }
                    })
                })
            },}
  })
   apiready = function () {
    vm.init();
}
 function focusInput(callback) {
        // 使用模块弹出键盘
        vm.softInput = api.require('softInputMgr');
        vm.softInput.toggleKeyboard();
        // 将相应的输入框获取焦点
        document.getElementById("textarea").focus()
        if (!!callback) {
            callback()
        }
    }
Logo

华为开发者空间,是为全球开发者打造的专属开发空间,汇聚了华为优质开发资源及工具,致力于让每一位开发者拥有一台云主机,基于华为根生态开发、创新。

更多推荐