vue项目实现全屏展示 screenfull.js

一般，我们不去做干涉，浏览器是这样显示的，如下：

 

 

 然后我们想要实现全屏展示，怎么实现呢？

先 npm i screenfull  安装这个全屏插件

然后  

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

 

methods写一个函数，

fullScreen(){
      if(!screenfull.isEnabled){ 
        this.$message.error('当前该浏览器不支持全屏展示')
        return false
      }
      screenfull.toggle()
    },

　　触发这个事件就可以了，如下