elementui表单校验复选框

在 ElementUI 中，可以使用 el-checkbox-group 组件来实现复选框的选择，使用 el-form-item 组件来实现表单校验。在 el-form-item 中设置 prop 属性来指定表单项的字段名，在 el-checkbox-group 中设置 v-model 绑定选中的值。然后在 el-form-item 中使用 rules 属性设置表单校验规则。

下面是一个示例代码：

<template>
  <el-form ref="form" :model="form" :rules="rules">
    <el-form-item label="爱好" prop="hobby">
      <el-checkbox-group v-model="form.hobby">
        <el-checkbox label="篮球"></el-checkbox>
        <el-checkbox label="足球"></el-checkbox>
        <<el-checkbox label="乒乓球"></el-checkbox>
      </el-checkbox-group>
    </el-form-item>
  </el-form>
</template>

<script>
export default {
  data() {
    return {
      form: {
        hobby: []
      },
      rules: {
        hobby: [
          { required: true, message: '请选择至少一项爱好', trigger: 'change' }
        ]
      }
    }
  }
}
</script>

在上面的示例中，el-checkbox-group 绑定了 form.hobby，即选中的值。在 el-form-item 中设置 prop="hobby"，表示该表单项对应的字段名为 hobby。在 rules 中设置了 hobby 的校验规则，要求该字段必填，如果未填会出现提示信息。在需要提交表单时，可以通过 this.$refs.form.validate() 来进行表单校验。