<img :src="pc" alt="" class="mr-20 cursor-pointer"  @click="intoBigScreen">    

intoBigScreen () {
      if (!screenfull.isFullscreen) {
        screenfull.toggle()
        setTimeout(() => {
          this.$router.push('/screen')
        }, 100)
      }
    },

安装vue大屏插件screenfull

npm install screenfull --save

import screenfull from 'screenfull';

数据大屏页面设置按钮实现全屏和退出全屏的切换:

<div class="buts1" @click="intoSys">进入系统</div>
<div  v-if="fullscreen" class="buts2"  @click="handleScreen">退出全屏</div>
<div v-else class="buts2"  @click="handleScreen">全屏</div>

method:
intoSys () {
  if (screenfull.isFullscreen) {
  screenfull.toggle()
}
 this.$router.back()
 },
handleScreen () {
 if (!screenfull.isEnabled) {
  this.$message.warning('您的浏览器不支持全屏，请更换浏览器再试~')
     return false
    }
    screenfull.toggle()
    screenfull.onchange(() => {
   this.fullscreen = screenfull.isFullscreen
  })
 },