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

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

 然后我们想要实现全屏展示,怎么实现呢?

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

然后  

import screenfull from "screenfull"; // 引入全屏显示
 
methods写一个函数,
fullScreen(){
      if(!screenfull.isEnabled){ 
        this.$message.error('当前该浏览器不支持全屏展示')
        return false
      }
      screenfull.toggle()
    },

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

猜你喜欢

转载自www.cnblogs.com/feibiubiu/p/12915409.html