使用screenfull.js在vue中實現瀏覽器全屏顯示

1.安裝

npm install --save screenfull

2.引入

import screenfull from 'screenfull'

3.調用

screenfull.toggle()

示例

<template>
  <div class="home">
    <button @click="open">全屏</button>
  </div>
</template>

<script>
import screenfull from 'screenfull'

export default {
  data() {
    return {
      isFullscreen:false,
    }
  },
  methods: {
    open() {
      if (!screenfull.enabled) {
        console.log("不支持全屏");
        return false;
      }
      screenfull.toggle();
      console.log("已全屏");
    }
  }
};
</script>