uniapp 垂直居中

在uniapp中实现垂直居中的方法有很多种，以下是其中一种常用的方法：

1. 使用flex布局

可以在父元素上设置display:flex和justify-content:center以及align-items:center实现垂直居中。

例如：

<template>
  <div class="container">
    <div class="centered">这是要居中的内容</div>
  </div>
</template>

<style>
.container {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100vh;
}

.centered {
  text-align: center;
}
</style>

2. 使用绝对定位

可以将要居中的元素设置为position:absolute，并设置top:50%以及transform:translateY(-50%)实现垂直居中。

例如：

<template>
  <div class="container">
    <div class="centered">这是要居中的内容</div>
  </div>
</template>

<style>
.container {
  position: relative;
  height: 100vh;
}

.centered {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
}
</style>

以上是两种比较常用的方法，可以根据具体场景选择适合自己的方法。