vue全屏组件vue-fullscreen使用

1. npm安装组件

 npm install vue-fullscreen --save

2. 在main.js文件中引入

  import fullscreen from 'vue-fullscreen'
  Vue.use(fullscreen)

3. 使用

<template>
  <div>
    <fullscreen :fullscreen.sync="fullscreen">
          全屏显示的内容     
    </fullscreen>

    <button @click="toggle">点击全屏</button>
  
  </div>
</template>

<script>
  export default{
    data(){
      return{
        fullscreen:false

      }
    },
    methods: {
      toggle(){
        this.fullscreen=!this.fullscreen
      }
    }
  }
</script>