NanJingLamanRadarProject/04.系统编码/Frontend/src/App.vue

<template>
    <Header v-if="showHeader" />
    <router-view />
</template>

<script lang="ts">
    import { onMounted, reactive, ref, toRefs, watch } from 'vue';
    import { useRouter } from 'vue-router';
    import Header from './components/Shared/Header.vue';


    export default {
        name: 'App',
        components: {Header},
        setup() {
            const router = useRouter();
            const showHeader = ref(false);

            onMounted(() => {
                getRem(1920, 100);
                window.onresize = () => getRem(1920, 100);
            })


            watch(() => router.currentRoute.value.path,
                (current, prev) => {
                    showHeader.value = current === "/Login" ? false : true;
                }
            );
            const getRem = (pwidth, prem) => {
                let html = document.getElementsByTagName("html")[0];
                let oWidth = document.body.clientWidth || document.documentElement.clientWidth;
                html.style.fontSize = oWidth / pwidth*prem + "px";
            }

            return {showHeader}
        }
    }
</script>
<style>
    @import "element-plus/theme-chalk/index.css";
</style>