element-ui树怎样控制多选时选中的数量

Question

checkbox时控制最多只能选择4个

Answer 1

在check回调函数判断当前选中是否大于4，如果大于4个就把当前选中的删除掉
this.max 就是最多可选数

Answer 2

<template>
<el-tree
        ref="groupTreeRef"
        node-key="groupId"
        show-checkbox
        highlight-current
        default-expand-all
        check-strictly
        :props="defaultProps"
        :data="groupList"
        @check="handleTreeCheck">
      </el-tree>
</template>
<script>
export default {
  methods: {
    handleTreeCheck (currNode, checkedInfo) {
      let groupId = currNode.groupId
      let arr = checkedInfo.checkedKeys
      let index = arr.findIndex(id => id === groupId)
      if (arr.length > 10) {
        this.showWarning('最多只能选择10个分组')
        arr.splice(index, 1)
        this.$refs.groupTreeRef.setCheckedKeys(arr)
      }
    },
  }
}
</script>