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 内容,请继续关注编程基础学习网。
织梦狗教程
本文标题为:vue项目中如何实现页面全屏功能


基础教程推荐
猜你喜欢
- gbk编码的网页如何设置加载utf-8编码的js文件 2022-11-04
- vuejs通过moment获取今日,昨日,上周,下周,上个 2024-12-08
- JavaScript JS获取url地址后面参数的方法 2024-12-20
- vue前端如何埋点,代码介绍 2025-01-12
- wow.js实现炫酷的页面滚动伴随动画示例详解 2024-02-04
- flex属性中align-items和align-content有什么区别 2024-12-13
- cookie的secure属性详解 2024-02-12
- php – 将html(mysql填充)表导出为excel文件 2023-10-26
- React 中使用 Redux 的 4 种写法小结 2024-02-08
- 详解Ajax和form+iframe 实现文件上传的方法(两种方式) 2022-12-18