vue全屏方法

// css
<li :class="['map-toolbar-item',!fullscreen?'':'active']" @click="launchFullScreen()">
      <i :class="['map-toolbar-icon', 'iconfont', 'iconfangda']"></i>

      <span class="map-toolbar-label">{{ !fullscreen?'全屏':'退出全屏' }}</span>
</li>

// script
data(){
	return{
		fullscreen: false,
	}
}
methods: {
    //开启全屏
    launchFullScreen() {
      this.fullscreen = !this.fullscreen;
      let element = document.documentElement;
      if (this.fullscreen) {
        if (element.requestFullscreen) {
          element.requestFullscreen();
        } else if (element.mozRequestFullScreen) {
          element.mozRequestFullScreen();
        } else if (element.webkitRequestFullscreen) {
          element.webkitRequestFullscreen();
        } else if (element.msRequestFullscreen) {
          element.msRequestFullscreen();
        }
      } else {
        if (document.exitFullscreen) {
          document.exitFullscreen();
        } else if (document.mozExitFullScreen) {
          document.mozExitFullScreen();
        } else if (document.webkitExitFullscreen) {
          document.webkitExitFullscreen();
        }
      }
    },