解决页面随意缩放 vue

使用vue时，需页面不可缩放，则只需要给public中的index.html文件添加这一行代码<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0" >但如果在ios的高版本中，在浏览器打开还

weixin_54009353

1725人浏览 · 2021-12-29 17:00:18

weixin_54009353 · 2021-12-29 17:00:18 发布

使用vue时，需页面不可缩放，则只需要给public中的index.html文件添加这一行代码

 <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0" >

但如果在ios的高版本中，在浏览器打开还是会随意缩放，所以这时还需要在index.html中添加如下代码，然后页面就不会随意缩放啦

<script>
      window.onload = function() {
        document.addEventListener('touchstart', function(e) {
          if (e.touches.length > 1) {
            e.preventDefault()
          }
        })
        document.addEventListener('gesturestart', function(e) {
          e.preventDefault()
        })
      }
      </script>