全屏 直接用

全屏方法 调用。handleCanFullScreen(‘.full-screen-dom’, this)

export default (dom, ctx) => {
  let fullscreenEnabled
  let prefixName

  const handleFullscreen = () => {
    const element = document.querySelector(dom)
    const methodName = !prefixName
      ? 'requestFullscreen'
      : `${prefixName}RequestFullScreen`

    element[methodName]()
  }

  if (document.fullscreenEnabled) {
    fullscreenEnabled = document.fullscreenEnabled
  } else if (document.webkitFullscreenEnabled) {
    fullscreenEnabled = document.webkitFullscreenEnabled
    prefixName = 'webkit'
  } else if (document.mozFullScreenEnabled) {
    fullscreenEnabled = document.mozFullScreenEnabled
    prefixName = 'moz'
  } else if (document.msFullscreenEnabled) {
    fullscreenEnabled = document.msFullscreenEnabled
    prefixName = 'ms'
  }

  if (!fullscreenEnabled) {
    ctx.$message.error('该浏览器不支持全屏，请使用使用最新谷歌浏览器~')
  } else {
    handleFullscreen()
  }
}

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33