1. FullScreen.vue
<template>
<span class="full_screen" @click="toggleFullScreen"></span>
</template>
<script>
import { mapActions, mapMutations, mapState } from 'vuex'
export default {
name: 'FullScreen',
data(){
return {
}
},
computed: {
...mapState('fullScreen', {
fullScreen: state => state.fullScreen,
}),
},
created(){
},
mounted(){
window.addEventListener('keydown', this.myKeyEvent)
if(document.exitFullscreen) {
document.addEventListener('fullscreenchange', this.changeFullscreenVar)
} else if(document.mozCancelFullScreen) {
document.addEventListener('mozfullscreenchange', this.changeFullscreenVar)
} else if(document.msExitFullscreen) {
document.addEventListener('MSFullscreenChange', this.changeFullscreenVar)
document.addEventListener('MSFullscreenE