[JavaScript知识库]elementui 多选框的使用

elementui 多选框的使用

checkbox-group元素能把多个 checkbox 管理为一组，只需要在 Group 中使用v-model绑定Array类型的变量即可。 el-checkbox 的 label属性是该 checkbox 对应的值，若该标签中无内容，则该属性也充当 checkbox 按钮后的介绍。label与数组中的元素值相对应，如果存在指定的值则为选中状态，否则为不选中。

html

<!-- v-model绑定的数组代表已经选择的选项 选择之后会把label中的值存入 v-model绑定的数组中 -->
    <el-checkbox-group v-model="roleIds">
      <el-checkbox v-for="item in list" :key="item.id" :label="item.id">{{ item.name }}</el-checkbox>
    </el-checkbox-group>

数据项

 data() {
    return {
      roleIds: [],
      list: []
    }
  },