vue+element ui 表单校验el-checkbox

怎么实现只选中一个的校验？

A: 可以通过自定义校验规则来实现只选中一个的校验。具体实现方式如下：

1. 在 el-checkbox-group 中添加 rules 属性，值为自定义的校验规则函数。

<el-checkbox-group v-model="checkedList" :rules="checkOneRule">
  <el-checkbox label="选项一"></el-checkbox>
  <el-checkbox label="选项二"></el-checkbox>
  <el-checkbox label="选项三"></el-checkbox>
</el-checkbox-group>

2. 编写 checkOneRule 自定义规则函数，使用 Array.prototype.filter 方法筛选出选中的复选框，然后根据选中数量判断是否合法。

checkOneRule(rule, value, callback) {
  if (value && value.length === 1) {
    callback();
  } else {
    callback(new Error('请选择一个选项'));
  }
}

3. 在 data 中定义 checkedList 数组来存储选中的值。

data() {
  return {
    checkedList: []
  }
}

这样就能实现只选中一个的校验了。