el-checkbox-button 限制勾选个数

`el-checkbox-button`是Element UI库中的一个组件，它通常用于单选或多选的复选框。如果你想在一个`el-checkbox-group`中限制用户能够勾选的复选框数量，你可以利用其提供的API属性和方法来实现。

首先，在Vue模板中，设置`el-checkbox-group`的`max`属性，它接收一个数字，表示允许的最大勾选数量：

<el-checkbox-group v-model="checkedCities" max="5">
  <el-checkbox-button v-for="city in cities" :label="city.id">{{ city.name }}</el-checkbox-button>
</el-checkbox-group>

在这个例子中，`checkedCities`是一个数组存储用户的勾选项，`cities`是你需要展示的选项列表。`max=5`意味着最多只能选择5个城市。

然后，在你的数据对象里，可以设置默认值，并在钩子函数如`beforeUpdate`中检查当前选择的数量是否超过最大值，如果超限，则清除多余的勾选：

data() {
  return {
    checkedCities: [], // 默认为空
    cities: ...,
    maxSelected: 5
  }
},
methods: {
  beforeUpdate() {
    if (this.checkedCities.length > this.maxSelected) {
      this.checkedCities = this.checkedCities.slice(0, this.maxSelected);
    }
  }
}

这样就实现了对`el-checkbox-button`勾选个数的限制。