样式调整

src/views/recruit/personal/shareJob/index.vue

@@ -5,8 +5,8 @@
   >
     <v-card
       class="cardBox py-3 px-5"
-      :class="windowWidth > 750 ? 'pc' : 'phone'"
-      :style="{'width': windowWidth > 750 ? '750px' : '100vw'}"
+      :class="isMobile ? 'phone' : 'pc'"
+      :style="{'width': isMobile ? '100%' : '750px'}"
     >
       <div v-if="!Object.keys(info).length">加载失败</div>
       <div>
@@ -67,18 +67,20 @@
 </template>
 
 <script setup>
-import { onMounted, onUnmounted, ref } from 'vue';
+import { onMounted, ref } from 'vue';
 import { getPositionDetails } from '@/api/position'
 import { dealDictObjData } from '@/utils/position'
 defineOptions({name: 'recruit-personal-shareJob-index'})
 // 组件挂载后添加事件监听器  
+const isMobile = ref(false)
 onMounted(() => {
-  window.addEventListener('resize', updateWindowSize)
-})
-// 组件卸载前移除事件监听器  
-onUnmounted(() => {
-  window.removeEventListener('resize', updateWindowSize)
+  const userAgent = navigator.userAgent
+  isMobile.value = /(phone|pad|pod|iPhone|iPod|ios|iPad|Android|Mobile|BlackBerry|IEMobile|MQQBrowser|JUC|Fennec|wOSBrowser|BrowserNG|WebOS|Symbian|Windows Phone)/i.test(userAgent)
 })
+// // 组件卸载前移除事件监听器  
+// onUnmounted(() => {
+//   window.removeEventListener('resize', updateWindowSize)
+// })
 // 获取路由参数
 const queryParams = new URLSearchParams(window.location.search)
 const jobId = queryParams.get('jobId') || ''
@@ -103,16 +105,6 @@ const desc = [
   { mdi: 'mdi-school-outline', value: 'eduName' },
   { mdi: 'mdi-clock-time-ten-outline', value: 'expName' }
 ]
-
-// 监听窗口大小变化事件
-const windowWidth = ref(window.innerWidth)
-const windowHeight = ref(window.innerHeight)
-const updateWindowSize = async () => {
-  windowWidth.value = window.innerWidth
-  windowHeight.value = window.innerHeight
-  console.log('windowWidth', windowWidth.value)
-  console.log('innerHeight', windowHeight.value)
-}
 </script>
 <style lang="scss" scoped>
 .f-w-600 { font-weight: 600; }
@@ -167,7 +159,7 @@ const updateWindowSize = async () => {
 }
 .cardBox {
   background-color: #fff;
-  overflow: auto;
+  // overflow: auto;
   min-height: 100vh;
 }
 .pc {