vue项目中如何实现页面全屏功能

vue项目中如何实现页面全屏显示，下面编程教程网小编给大家详细介绍一下实现代码！

1、安装脚手架

npm install vue-fullscreen

2、main.js全局引入

import fullscreen from 'vue-fullscreen'

Vue.use(fullscreen)

3、具体代码调用

fullscreen() {
  // 需要全屏显示的dom元素
  let dom = this.$el.querySelector('.div')     
  // 调用全屏方法      
  this.$fullscreen.enter(dom, {  
    wrap: false, 
    callback: f => {
       this.fullscreenFlag = f       
    }     
  })    
 }

以上是编程学习网小编为您介绍的“vue项目中如何实现页面全屏功能”的全面内容，想了解更多关于 vuejs 内容，请继续关注编程基础学习网。