这是效果图 点击全屏按钮 浏览器的菜单栏消失 屏幕上只显示我们的后台系统
首先安装系统全屏插件screenfull
npm install --save screenfull
安装完成后 在点击全屏这个事件上 做操作
<template>
<div id="aa">
<i @click="fullScreen()" class="full-screen"></i>
</div>
</template>
引入插件
<script>
import screenfull from 'screenfull'
</script>
在点击事件上直接复制下面函数
fullScreen () {
if (!screenfull.isEnabled) {
this.$message({
message: 'you browser can not work',
type: 'warning'
})
return false
}
screenfull.toggle()
},
好了 这样我们的点击全屏功能就可以啦