欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

elementui 多选框的使用

程序员文章站 2022-07-13 23:05:15
...

elementui 多选框的使用

checkbox-group元素能把多个 checkbox 管理为一组,只需要在 Group 中使用v-model绑定Array类型的变量即可。 el-checkboxlabel属性是该 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: []
    }
  },