症状是选择的时候会同时选取所有的选项，同时控制台报错<transition-group> children must be keyed: <ElTag>。

简而言之，是因为没有指定el-select的value-key属性，或者没有正确指定el-select的value-key属性。按照官网的说法：

如果 Select 的绑定值为对象类型，请务必指定 value-key 作为它的唯一性标识。

参数 说明 类型 可选值 默认值
value-key 作为 value 唯一标识的键名，绑定值为对象类型时必填 string — value
正确的使用方法如下：

<template>
    <!--value-key的值对应于item里的唯一字段-->
    <el-select v-model="value"
               value-key="label">
        <el-option v-for="item in options"
                   :label="item.label"
                   :key="item.label"
                   :value="item"/>
    </el-select>
</template>

<script>
    export default {
        data() {
            return {
                options: [{
                    value: '选项1',
                    label: '黄金糕'
                }, {
                    value: '选项2',
                    label: '双皮奶'
                }],
                value: {}
            }
        }
    }
</script>

如果允许同时选择多个选项，添加multiple属性，并且把value改成[]即可：

<template>
    <el-select v-model="value"
               value-key="label"
               multiple>
        <el-option v-for="item in options"
                   :label="item.label"
                   :key="item.label"
                   :value="item"/>
    </el-select>
</template>

<script>
    export default {
        data() {
            return {
                options: [{
                    value: '选项1',
                    label: '黄金糕'
                }, {
                    value: '选项2',
                    label: '双皮奶'
                }],
                value: []
            }
        }
    }
</script>

可能还有一个需要注意的地方，就是value-key的位置，一定要放在el-select上，而不是el-option上；放错位置是不会生效的。

这是自己的代码。

      <el-form-item label="" prop="createBy">
        <el-select
          v-model="query.createBy"
          clearable
          placeholder="活码创建人"
          multiple 
          value-key="userId"
          ref="select"
          popper-class="depart-member-mulitiple-select"
        >
          <el-option
            :key="item.userId"
            :label="item.name"
            :value="item"
            disabled
            v-for="(item,index) in options"
            v-show="index==0"
          >
            <ChooseCompany   
            v-if="index==0" @selectMan="ChoosePeople"></ChooseCompany>
          </el-option>
        </el-select>
      </el-form-item>

image.png

有一个注意的地方，只设置一个option，但是要query.createBy的值是外界传入的 ，要显示tag，外界传入的值必须在options的数组内，但是赋值options后回陈胜多个option，灵活使用v-show和v-if,v-if会重新创建请求后台数据，但是又要显示option，所以要v-show。

<script src="//unpkg.com/vue/dist/vue.js"></script>
<script src="//unpkg.com/element-ui@2.15.0/lib/index.js"></script>
<div id="app">
<template>
  <el-select v-model="value1" @change="getWord"  placeholder="请选择" value-key="label">
    <el-option
      v-for="item in options"
      :key="item.value"
                
      :label="item.label"
      :value="item">
    </el-option>
  </el-select>

  <el-select
    v-model="value2"
    multiple
             value-key="label"
    collapse-tags
    style="margin-left: 20px;"
    placeholder="请选择">
    <el-option
      v-for="item in options"
      :key="item.value"
      :label="item.label"
      :value="item">
    </el-option>
  </el-select>
</template>
</div>

var Main = {
    methods:{
      getWord(val){
        console.log(444,val)
      }
    },
    data() {
      return {
        options: [{
          value: '选项1',
          label: '黄金糕'
        }, {
          value: '选项2',
          label: '双皮奶'
        }, {
          value: '选项3',
          label: '蚵仔煎'
        }, {
          value: '选项4',
          label: '龙须面'
        }, {
          value: '选项5',
          label: '北京烤鸭'
        }],
        value1: {},
        value2: [{
          value: '选项4',
          label: '龙须面'
        }, {
          value: '选项5',
          label: '北京烤鸭'
        }]
      }
    }
  }
var Ctor = Vue.extend(Main)
new Ctor().$mount('#app')

选中的值要在options中，不然tag没有值

options的数据要小改，如果大改就会引起select重新渲染，重新load请求。