elementui 省市 多选框

以下是使用ElementUI实现省市多选框的示例代码：

<template>
  <div>
    <el-checkbox v-model="checkAll" @change="handleCheckAllChange">全选</el-checkbox>
    <el-checkbox-group v-model="checkedCities" @change="handleCheckedCitiesChange">
      <el-checkbox v-for="city in cities" :key="city" :label="city">{{ city }}</el-checkbox>
    </el-checkbox-group>
  </div>
</template>

<script>
export default {
  data() {
    return {
      cities: ['北京', '上海', '广州', '深圳', '杭州', '南京', '武汉', '成都'],
      checkAll: false,
      checkedCities: []
    };
  },
  methods: {
    handleCheckAllChange(val) {
      this.checkedCities = val ? this.cities : [];
    },
    handleCheckedCitiesChange(val) {
      let checkedCount = val.length;
      this.checkAll = checkedCount === this.cities.length;
    }
  }
};
</script>

在这个示例中，我们使用了ElementUI的`el-checkbox`和`el-checkbox-group`组件来实现多选框。`cities`数组中存储了所有可选的省市，`checkAll`表示是否全选，`checkedCities`存储了用户选择的省市。当用户点击全选框时，我们将`checkedCities`设置为所有省市，当用户选择或取消选择某个省市时，我们需要更新`checkAll`的状态。