uniappH5自适应布局

uniapp H5自适应布局可以通过设置viewport的meta标签来实现。具体步骤如下：

1. 在index.html文件的head标签中添加以下meta标签：

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

2. 在App.vue文件中添加以下样式：

html,body{
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  font-size: 14px;
}

3. 在需要自适应的组件中，使用rem作为单位进行布局。可以在main.js文件中设置rem基准值：

// main.js
import Vue from 'vue'
import App from './App'

// 设置rem基准值
const baseSize = 14
function setRem () {
  const scale = document.documentElement.clientWidth / 375
  document.documentElement.style.fontSize = baseSize * Math.min(scale, 2) + 'px'
}
setRem()
window.onresize = function () {
  setRem()
}

Vue.config.productionTip = false

App.mpType = 'app'

const app = new Vue({
    ...App
})
app.$mount()