VUE使用screenfull全屏

安装

npm install --save screenfull

在需要的页面引用

import screenfull from 'screenfull'

全屏使用

<template>
  <span @click='clickFullscreen'>全屏</span>
</template>
 
<script>
  import screenfull from 'screenfull'
  export default{
    name: 'screenfull',
    data(){
      return {
        isFullscreen: false
      }
    },
    methods:{
      clickFullscreen(){
        if (!screenfull.isEnabled) {
          this.$message({
            message: 'you browser can not work',
            type: 'warning'
          })
          return false
        }
        screenfull.toggle()
      }
    }
  }
</script>