<button @click="openView">打開(kāi)全屏</button>
// 樣式設(shè)置為fixed占滿瀏覽器可視部分
<div id="monitor-pick" class="view-part">
    </div>

mounted() {
    window.addEventListener('resize', () => { 
      if (!this.checkFull()) { // 頁(yè)面結(jié)構(gòu)變化時(shí)，判斷當(dāng)前是否處于全屏，否，則隱藏或恢復(fù)展示部分
        this.JQ('#monitor-pick').fadeOut()
      }
    })
  },

methods:{
  openView() {
      this.JQ('#monitor-pick').fadeIn() // 需要設(shè)置全屏的圖片或者頁(yè)面
      this.viewShow = true
      setTimeout(() => {
        var el = document.documentElement
        var rfs = el.requestFullScreen || el.webkitRequestFullScreen || el.mozRequestFullScreen || el.msRequestFullscreen     
        if(typeof rfs != 'undefined' && rfs) {
          rfs.call(el)
        }
      }, 400)
    },
  checkFull(){
        //判斷瀏覽器是否處于全屏狀態(tài) （需要考慮兼容問(wèn)題）
        //火狐瀏覽器
        var isFull = document.mozFullScreen||
        document.fullScreen ||
        //谷歌瀏覽器及Webkit內(nèi)核瀏覽器
        document.webkitIsFullScreen ||
        document.webkitRequestFullScreen ||
        document.mozRequestFullScreen ||
        document.msFullscreenEnabled
        if(isFull === undefined) {
          isFull = false
        }
        return isFull
    },
}