vue項目實現全屏展示 screenfull.js

一般，我們不去做干涉，瀏覽器是這樣顯示的，如下：

 

 

 然后我們想要實現全屏展示，怎么實現呢？

先 npm i screenfull  安裝這個全屏插件

然后  

import screenfull from "screenfull"; // 引入全屏顯示

 

methods寫一個函數，

fullScreen(){
      if(!screenfull.isEnabled){ 
        this.$message.error('當前該瀏覽器不支持全屏展示')
        return false
      }
      screenfull.toggle()
    },

　　觸發這個事件就可以了，如下