在進行聊天界面開發的時候，發現安卓手機鍵盤會把界面頂起，但是不會收回來，在網上找到了這個方法解決

const originalHeight=document.documentElement.clientHeight ||document.body.clientHeight;
            window.onresize = ()=>{
                return(()=>{
                    //鍵盤彈起與隱藏都會引起窗口的高度發生變化
                    const resizeHeight=document.documentElement.clientHeight || document.body.clientHeight;
                    console.log("進入到判斷頁面高度=========");
                    console.log("頁面初始高度========="+originalHeight);
                    console.log("軟鍵盤彈起高度========="+resizeHeight);
                    if(resizeHeight-0<originalHeight-0){
                    //當軟鍵盤彈起，在此處操作
                    console.log("進入到軟鍵盤彈起=========");
                        document.querySelector('body').setAttribute('style', 'height:'+originalHeight+'px;');
                        this.scrollerHeight=resizeHeight;
                    }else{
                    //當軟鍵盤收起，在此處操作
                    console.log("進入到軟鍵盤收起=========");
                    document.querySelector('body').setAttribute('style', 'height:100%;');
                    this.scrollerHeight="100%";
                    }
                })()

            }

之前我是在mounted中根據document.activeElement.tagName的值判斷是否為INPUT去改變鍵盤彈起的高度

window.addEventListener("resize", () => {
                if (document.activeElement.tagName === "INPUT") {
                    
                }
            });

但是在下方加了一個按鈕之后，發現點擊語音按鈕后再切換到輸入框，

WechatIMG15.jpeg

document.activeElement.tagName的值變成BODY了，查找資料發現

document.activeElement僅對input、textarea等標準的輸入文本有效；對于div等非編輯類的元素(即使開啟了contentEditable)，返回的值為BODY。

所以此方法在點擊語音后再也調用不起來，困擾了一天的問題，記錄一下