< el-select ref ="select" v-model ="value" multiple placeholder ="请选择" > < el-option v-for ="item in options" :key ="item.value" :label ="item.label" :value ="item.value" > < el-checkbox @change ="clickBox(item.value)" :value ="value.includes(item.value)" :label ="item.label" ></ el-checkbox > </ el-option > < div class ="btn-div" > < el-row type ="flex" justify ="center" > < el-col :span ="12" style ="text-align: center;" > < el-button size ="mini" type ="primary" @click ="ok" > 确定 </ el-button > </ el-col > < el-col :span ="12" > < el-button size ="mini" @click ="cancel" > 取消 </ el-button > </ el-col > </ el-row > </ div > </ el-select > </ div >

2、对应的js

export default {
    data() {
      return {
        options: [],
        value: []
    mounted() {
      let options = []
      for (let index = 1; index <= 5; index++) {
        options.push({
          value: index,
          label: '选项' + index
      this.options = options
      console.log('mounted....')
    methods: {
      cancel() {
        this.$message('点击了取消~');
        this.$refs.select.blur()
      ok() {
        this.$message('点击了确定~');
        this.$refs.select.blur()
      clickBox(val) {
        console.log('val::', val);
        let values = this.value
        if(values.includes(val)) {
          this.value = values.filter(n => n !== val)
        } else {
          values.push(val)
          this.value = values
        console.log('this.value::', this.value)
三、扩展（下拉框内容过多时按钮悬浮显示，并支持全部选中/取消）
   具体代码，点击链接下载
    让每一天过的有意义！