Vue 弹出框遮罩遮挡内容问题及全屏使用

1.使用一个全屏功能后弹出框的遮罩还在，下列属性置为false

 

2.使用全屏功能后弹框内容和$message确认框一起使用，内容被遮挡，下列属性置为true

3.全屏使用，下面方法直接调用无效，可绑定标签调用click事件：

如： document.getElementById('click').click();

    requestFullscreen () {
      // 由于使用具体元素全屏后会使modal弹框无法显示的问题, 所以下列使用document.documentElement
      // let element = document.getElementById('fullscreen')
      let element = document.documentElement
      if (element.requestFullscreen) {
        element.requestFullscreen()
      } else if (element.msRequestFullscreen) {
        element.msRequestFullscreen()
      } else if (element.mozRequestFullScreen) {
        element.mozRequestFullScreen()    
      } else if (element.webkitRequestFullscreen) {
        element.webkitRequestFullscreen()
      }
    },

 // css全屏样式，需要全屏的元素
 #fullscreen {
    position: fixed!important;
    object-fit: contain;
    top: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    min-width: 0 !important;
    max-width: none !important;
    min-height: 0 !important;
    max-height: none !important;
    width: 100% !important;
    height: 100% !important;
    transform: none !important;
    margin: 0 !important;
  }