vue解决PC端等比缩放适配手机端

在App.vue中

  setup () {
    const bodyScale = () => {
      let devicewidth = document.documentElement.clientWidth//获取当前分辨率下的可是区域宽度
      let scale = devicewidth / 1920 // 分母——设计稿的尺寸
      document.body.style.zoom = scale//放大缩小相应倍数
    }
    onMounted(() => {
      bodyScale()
      window.onresize = () => {
        return (() => {
          bodyScale()
        })()
      }
    })
  }

即可等比缩放适配手机端了

vue解决PC端等比缩放适配手机端_第1张图片

禁止鼠标滑轮缩放网页参见

https://www.csdn.net/tags/OtDagg2sNTY3NTctYmxvZwO0O0OO0O0O.html

vue解决PC端等比缩放适配手机端_第2张图片

 

你可能感兴趣的:(Vue,vue等比缩放适配手机端,vue)