vue项目中实现浏览器全屏 - screenfull

浏览器中自带全屏功能，不过有兼容性问题，所以改用插件

document.documentElement.webkitRequestFullScreen()

使用screenFull插件来提供全屏功能

安装插件

npm i screenfull 

 使用插件

在全屏组件中引入       import screenfull from 'screenfull'

给icon 添加点击事件

<el-icon size="18px" @click="magnify"><full-screen /></el-icon>

const magnify = () => {
	;(screenfull as any).toggle()
}

实现效果