kidArtExpo/src/views/login/index.vue

<script setup>
import {useAuth} from "@/store/auth/index.js";

import {useAdaptation} from "@/utils/self-adaption.js";
import {sizes} from "@/dict/index.js";
import size375 from '@/views/login/size375/index.vue'
import size768 from '@/views/login/size768/index.vue'
import size1440 from '@/views/login/size1440/index.vue'
import size1920 from '@/views/login/size1920/index.vue'
import {computed} from "vue";
import {useWindowSize } from '@vueuse/core';
const {clickSendCode}= useAuth()
const { width, height } = useWindowSize()
const isLandscape = computed(() => width.value > height.value)
const {currentRange }= useAdaptation(sizes)
localStorage.clear()
console.log('执行1111')
const viewComponent = computed(()=>{
switch (currentRange.value?.minWidth){
  case '0px':
    return size375
  case '768px':
    // 如果是ipad 横屏
    if (isLandscape.value){
      return size1440
    }
    return size768
  case '1440px':
    return size1440
  case '1920px':
    return size1920
}
})
</script>

<template>
<component @sendCode="clickSendCode" :is="viewComponent"></component>
</template>

<style scoped lang="scss">

</style>