如何让上述代码的表单元素居中

可以使用 CSS 来实现表单元素居中的效果，具体做法如下：

1. 在表单外层包裹一个 div 容器，并设置该容器的样式为居中显示。

<template>
  <div class="form-container">
    <!-- 表单代码 -->
  </div>
</template>

<style>
.form-container {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100vh; /* 可根据实际情况调整高度 */
}
</style>

2. 给表单元素添加样式 `margin: 0 auto;`，使其水平居中。

<template>
  <div class="form-container">
    <el-form ref="form" :model="form" label-width="120px">
      <el-form-item label="图片上传" style="margin: 0 auto;">
        <!-- 图片上传代码 -->
      </el-form-item>
      <el-form-item label="单选框" style="margin: 0 auto;">
        <!-- 单选框代码 -->
      </el-form-item>
    </el-form>
    <el-button type="primary" @click="submitForm" style="margin: 0 auto;">提交</el-button>
  </div>
</template>

<style>
.form-container {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100vh; /* 可根据实际情况调整高度 */
}
</style>

这样，表单元素就能够在水平方向上居中显示了。