vue 实现全屏和退出全屏的功能

<span class="icon-contain" @click="getFullCreeen"> <svg-icon icon-class="quanping" /> </span>

JS

export default { name:'topHeader', data(){ return{ n:0 } }, methods:{ getFullCreeen(){ this.n++; this.n%2==0? this.outFullCreeen(document):this.inFullCreeen(document.documentElement) }, inFullCreeen(element){ let el = element; let rfs = el.requestFullScreen || el.webkitRequestFullScreen || el.mozRequestFullScreen || el.msRequestFullScreen; if (typeof rfs != "undefined" && rfs) { rfs.call(el); } else if (typeof window.ActiveXObject != "undefined") { let wscript = new ActiveXObject("WScript.Shell"); if (wscript != null) { wscript.SendKeys("{F11}"); } } }, outFullCreeen(element){ let el = element; let cfs = el.cancelFullScreen || el.webkitCancelFullScreen || el.mozCancelFullScreen || el.exitFullScreen; if (typeof cfs != "undefined" && cfs) { cfs.call(el); } else if (typeof window.ActiveXObject != "undefined") { let wscript = new ActiveXObject("WScript.Shell"); if (wscript != null) { wscript.SendKeys("{F11}"); } } } } }

但是发现在我的系统内，出现一个bug，文字提示会被遮挡，如下：

也没有找到去掉提示的办法，不知道在你们的系统里面有没有出现类似的问题