Webapp font size follows system font size scaling

in a recent project, using the front end of vue development, the native webview nests H5 pages. The leader wants to make the H5 pages in webview become larger after the font size of the mobile phone system becomes larger. Now some places in H5 can become larger, some are not larger, and they are not uniform. Adaptation is the use of rem to do the adaptation, individual text label font size can be larger, like the input box input,textarea in the font size is not larger, has anyone done similar, but there is a solution.

Html5 vue.js

Mar.13,2022

because the rem adaptation method is used, after discussing with his Android colleague, after he gets the font size adjusted by the system, he will send me the zoom ratio. I will resize the fontsize on the html according to the parameters he passed, and then the elements on the page will naturally be resized according to the size of the root element.

setScaleFont(){
      let fontScale=1;
      let scaleFontSize;
      let initFontSize;
      fontScale=parseFloat(window._nativeMe.getFontScale());
      console.log(`:${fontScale}`);
      let docHtml=document.getElementsByTagName("html")[0];
      initFontSize=this.getStyle(docHtml,'fontSize').split('px')[0];
      scaleFontSize=fontScale*initFontSize;//1-1.4
      docHtml.style.fontSize=scaleFontSize +'px';
    },
    getStyle(obj, name){
      if(window.currentStyle){
        return obj.currentStyle[name];
      }
      else{
        return getComputedStyle(obj, false)[name];
      }
    },

this method is only applicable to Android. Apple cannot get the zoom of the system font size due to permission problems, so it is invalid. If there is a big god who has a way to solve the problem of zooming in and out of Apple, please let me know. I would appreciate it

Previous: How to deal with the confusion of icmp return message reception caused by multithreaded ping?

Next: Can crawler API be called?

Vue page switching fixed positioning problem?
<template> <div style="height: 100%;"> <mt-header title=""> <mt-button icon="back" slot="left" v-tap="{methods: switchView, view: Post }">< mt-button> &l...

Css3 css html5 vue.js

Feb.27,2021
The video embedded in Youku on mobile cannot be played.
I use vue-cli to build the mobile project, and then use iframe to embed Youku s video code as follows <iframe width=100% height=350 src="http: player.youku.com embed XMzI1NTY2Nzc0MA==" frameborder=0 allowfullscreen>< iframe> th...

Javascript html5 vue.js

Feb.27,2021
How many ways to bring in resources when displaying pictures in img on vue pages?
data () { return{ img:require(".. .. .. static imgs advance icon_1.png"), =============== repuire es6 webpack ? ============== ...

Html5 vue.js

Mar.01,2021
Xiaobai asked, how to add an editable row to the ElementUI table?
as shown in the picture, I want to click the button to add a new line in which the Input box that was just released is editable and looks at the document as if there is no solution. Do you have any solutions? ...

Javascript html5 vue.js

Mar.02,2021
The img.onload nested in fileReader.onload cannot get external variables (async, closures).
the code is as follows: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equ...

Javascript html html5 vue.js

Mar.04,2021
How does select in element choose before emptying after the drop-down data has changed?
as shown in figure 1, in the first drop-down selection, the second select is dynamically assigned, select I m a little confused. During the novice trial, I don t know how to clear the second when the first select changes. ...

Html5 vue.js element-ui

Mar.09,2021
Why does @ key-frames animation have no effect in the production environment of vue project?
A single page built in the vue project. The bottom of the page is used to prompt the user to turn the page, similar to the small icon scrolling with the mouse, and there is a small circular animation. The code is as follows (the outer icon of saving tim...

Css3-Animation html5 vue.js

Mar.09,2021
How to implement the icon in vue? click on the icon and change it to another icon (radio only)
< html > <head> <meta charset="UTF-8" > <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=no" > <title>< title> <link rel="stylesheet&...

Html5 vue.js

Mar.10,2021
How to operate the item under the list looped out by v-for in vue to hide the clicked element
I use the favorites list looped out by v-for. If I want to click on the hearts area of a favorites list, the favorites list will be hidden and removed. But every time I click on one of them, the looped list is all hidden. The code is as follows: html s...

Html5 vue.js

Mar.11,2021
After the H5 page written by vue jumps, the data request is successful but does not render. Tap the screen to render successfully.
The h5 page written by vue has a problem with ok, on some andriod under ios. Each request data page will not be rendered (if there is a loading will always be loading), need to re-touch the screen (anywhere) page to re-render. there are mainly the fo...

Html5 vue.js

Mar.11,2021
The official vue document will be saved to the desktop when it is opened on the mobile phone. How is it realized?
have you seen the offline cache of h5 on PC, so is the offline cache of h5 also implemented on mobile phones? ...

Html5 vue.js

Mar.12,2021
Vue uses picture-card of el-upload in element-ui
how do I render the images, returned by the API to the photo wall of element-ui? Baidu on its own for a long time, did not find similar problems ~ help you giant! ...

Css html5 vue.js

Mar.12,2021
How to control the display time of the vue-z-toast plug-in?
how to control the display time of the vue-z-toast plug-in? (parameter list not found) ask ...

Html5 vue.js

Mar.17,2021
The address behind the vue: src is the local picture.
1. When using vue, there are many pictures in the local images tempbanner directory. When entering, a pageName, will be added to pageName as banner1; 2, and the image can be opened using ...

Javascript html5 vue.js

Mar.18,2021
The speed of data requested by vuex asynchronously is slower than that of page rendering.
the page has been rendered after calling the method in actions to get the data asynchronously. And reported an error. ...

Html5 vue.js javascript

Mar.18,2021
Vue sets the class of the object button according to the different values selected by the checkbox
set the class (buybtn-1,buybtn-2,buybtn-3,buybtn-4) of the object button according to the style selected by the radio box <button type="button" class="hide" title="" >< button> <div class="form-row&qu...

Css html5 vue.js

Mar.18,2021
Does vue implement data docking similar to alphabetically sorted address books?
as shown in the following figure, you need to achieve this effect: : ?,:HTML: js: I would like to ask if the gods have any more efficient methods? ...

Javascript html5 vue.js

Mar.19,2021
Canvas implements smearing a picture to generate a new picture.
1. Use vue combined with canvas to smear some of the contents of the picture and generate a new image which god can recommend the relevant plug-ins, or have a good solution ...

Javascript html5 vue.js html

Mar.19,2021
How to ensure that the mobile vue can only enter the amount?
how do I ensure that only the amount can be entered in the input for mobile vue projects? Including numbers and decimal points. It is found that if you adjust type= tel , there are only numbers but no decimal point, and type= number has other symbo...

Html5 vue.js javascript

Mar.22,2021
Click on the marker of Baidu Map to play the pop-up window component written by yourself. The component cannot be hidden and displayed using v-show.
in the vue project, I wrote a pop-up window component because the pop-up window style could not be changed. By clicking marker to show and hide it, I wanted to directly use v-show to show and hide, but to no avail. I think it s because there is somethi...

Javascript html5 vue.js

Mar.23,2021