vue 2.x 大屏自适应组件（摘录 https://gitee.com/zhangfucheng197/large-screen/tree/master/）

<template>
  <div class="screen-wrapper" ref="screenWrapper" :style="wrapperStyle">
    <slot></slot>
  </div>
</template>
<script>
function debounce(fn, delay) {
   
  let timer = null
  return function (...args) {
   
    timer = setTimeout(
      () => {
   
        typeof fn === 'function' && fn.apply(null, args)
        clearTimeout(timer)
      },
      delay > 0 ? delay : 100
    )
  }
}

export default {
   
  name: 'VScaleScreen',
  props: {
   
    width: {
   
      type: [String, Number],
      default: 1920
    },
    height: {
   
      type: [String, Number],
      default: 1080
    },
    fullScreen: {
   
      type: Boolean,
      default: false
    },
    autoScale: {
   
      type: [Object, Boolean],
      default: true
    },
    selfAdaption: {
   
      type: Boolean,
      default: true
    },
    delay: {
   
      type: Number,
      default: 500
    },
    boxStyle: {
   
      type: Object,
      default: () => ({
   })
    },
    wrapperStyle: {
   
      type: Object,
      default: () => ({
   })
    }
  },
  data() {
   
    return {
   
      currentWidth: 0,
      currentHeight: 0,
      originalWidth