<template>
  <router-view></router-view>
</template>

<script>
import { getCurrentInstance } from "vue";

export default {
  name: "App",
  setup() {
    const { proxy } = getCurrentInstance();
    function change(type) {
      proxy.$i18n.locale = type;
    }
    return { change };
  },
  data() {
    return {};
  },
  mounted() {
    // First we get the viewport height and we multiple it by 1% to get a value for a vh unit
    let vh = window.innerHeight * 0.01;
    // Then we set the value in the --vh custom property to the root of the document
    document.documentElement.style.setProperty("--vh", `${vh}px`);

    // We listen to the resize event
    window.addEventListener("resize", () => {
      // We execute the same script as before
      let vh = window.innerHeight * 0.01;
      console.log(vh);
      document.documentElement.style.setProperty("--vh", `${vh}px`);
    });
  }
};
</script>

<style rel="stylesheet/scss" lang="scss">
// element-ui警告弹框对移动端优化
@media screen and (max-width: 450px) {
  .el-message {
    min-width: 80%;
  }
}
</style>