Parcourir la source

调整移动端适配

Lijy il y a 2 ans
Parent
commit
c957b19b7d

+ 2 - 1
fhKeeper/formulahousekeeper/timesheet_h5/babel.config.js

@@ -6,7 +6,8 @@ module.exports = {
                 libraryName: "vant",
                 libraryDirectory: "es",
                 // 指定样式路径
-                style: name => `${name}/style/less`
+                // style: name => `${name}/style/less`
+                style: true
             },
             "vant"
         ],

Fichier diff supprimé car celui-ci est trop grand
+ 184 - 179
fhKeeper/formulahousekeeper/timesheet_h5/package-lock.json


+ 1 - 0
fhKeeper/formulahousekeeper/timesheet_h5/package.json

@@ -17,6 +17,7 @@
     "css-loader": "^3.6.0",
     "dingtalk-jsapi": "^2.13.42",
     "echarts": "^4.9.0",
+    "jquery": "^3.6.1",
     "style-loader": "^1.3.0",
     "vue": "^2.6.12",
     "vuex-persistedstate": "^2.7.1",

+ 28 - 1
fhKeeper/formulahousekeeper/timesheet_h5/src/App.vue

@@ -8,9 +8,36 @@
 </template>
 
 <script>
+import $ from 'jquery'
 export default {
     name: "app",
-    created() { }
+    created() { },
+    mounted() {
+      let width=$("body").width();
+      console.log(width)
+      if(width>=1200){
+        let fontsize=width/1920*40;//fontsize为当前屏幕的基数字体,相对于设计稿计算得到的。
+        $("html").css("font-size",`${fontsize}px`)
+      }
+      if(width<=750){
+        let fontsize=width/400*40;
+        $("html").css("font-size",`${fontsize}px`)
+      }
+      //当加载页面的时候设置生效
+      window.onresize = () => {
+        return (() => {
+          let width=$("body").width();
+          if(width>=1200){
+            let fontsize=width/1920*40;
+            $("html").css("font-size",`${fontsize}px`)
+          }
+          if(width<=750){
+            let fontsize=width/400*40;
+            $("html").css("font-size",`${fontsize}px`)
+          }
+        })()
+      }
+    }
 };
 </script>