vue中全屏screenfull.js的使用

vue中全屏screenfull.js的使用

安装screenfull

1.使用npm安装 screenfull
npm install screenfull --save

使用方式

1. 在使用的页面正确引入
   import screenfull from ‘screenfull’

2.   data(){
        return {
    		 //默认不全屏
            isFullscreen: false
        } 
     },
   

3. 增加点击全屏的方法, 这里使用 elementui下的msg进行提示

    click(){
        // 如果不允许进入全屏，发出不允许提示 浏览器不能全屏
        if(!screenfull.enabled){
            this.$message({
                message:'浏览器不能全屏',
                type:'warning'
            })
            return false
        }
      	screenfull.toggle()
       this.$message({
            message: '全屏啦',
            type: 'success'
        })
    }