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

zhaokai621

已于 2022-07-05 15:11:45 修改

阅读量2.2k

点赞数 1

分类专栏： Vue 文章标签： vue等比缩放适配手机端 vue

于 2022-07-05 14:19:40 首次发布

本文链接：https://blog.csdn.net/zhaokai621/article/details/125618861

版权

Vue 专栏收录该内容

6 篇文章 0 订阅

订阅专栏

在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()
        })()
      }
    })
  }

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