vue子菜单页面全屏展示及退出全屏

vue子菜单页面全屏展示及退出全屏

<template>
    <div id="day" tabindex="0" @keydown.esc="escFullScrean"></div>
</template>

methods: {
    screen(){
        document.getElementsByTagName('main')[0].classList.add('fullScrean');
        console.log(document.getElementsByTagName('main'))
    },
    escFullScrean(){
        document.getElementsByTagName('main')[0].classList.remove('fullScrean');
    },
}

.fullScrean{
    position: fixed;
    width: 103%;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 100;
    margin-left: -1%;
    margin-top: -1%;
}