<template>
  <div class="h5-page-container">
    <div class="h5-page-content">
      <router-view />
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      scalc: 1,
      timeStr: '',
      timeTimer: null
    }
  },
  created() {
    // 监听页面大小变化
    this.initWindow()
    window.onresize = () => {
      this.initWindow()
    }
  },
  beforeDestroy() {
    // window.onresize = null
    document.documentElement.style.fontSize = ''
  },
  methods: {
    initWindow() {
      const { innerWidth } = window
      const scalc = innerWidth / 750
      const fontSize = scalc * 20
      this.scalc = scalc
      document.documentElement.style.fontSize = fontSize + 'px'
    }
  }
}
</script>

<style lang="scss" scoped>
.h5-page-container{
  display: flex;
  align-items: center;
  justify-content: center;
  position: fixed;
  width: 100%;
  height: 100%;
}
.h5-page-content{
  // max-width: 750px;
  width: 100%;
  height: 100%;
}
</style>
