禁用选项

在el-option中，设定disabled值为 true，即可禁用该选项

全部禁用

为el-select设置disabled属性，则整个选择器不可用

可清空单选

为el-select设置clearable属性，则可将选择器清空。需要注意的是，clearable属性仅适用于单选。

多选

为el-select设置multiple属性即可启用多选，此时v-model的值为当前选中值所组成的数组。默认情况下选中值会以 Tag 的形式展现，你也可以设置collapse-tags属性将它们合并为一段文字。

自定义模板

<span style="float: left">{{ item.label }}</span>
<span style="float: right; color: #8492a6; font-size: 13px">{{ item.value }}</span>

创建条目

用allow-create属性即可通过在输入框中输入文字来创建新的条目。注意此时filterable必须为真。本例还使用了default-first-option属性，在该属性打开的情况下，按下回车就可以选中当前选项列表中的第一个选项，无需使用鼠标或键盘方向键进行定位。

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


      <el-option></el-option>
      <el-option disabled></el-option>

    </el-select>


    <el-select multiple clearable v-model="selectvalue" filterable allow-create >
      <el-option v-for="option in options" :key="option" :value="option.key" :label="option.value">

        <span style="float: left">{{ option.key }}</span>
        <span style="float: right; color: #8492a6; font-size: 13px">{{ option.value }}</span>


      </el-option>
    </el-select>


    <el-select  multiple v-model="selectvalue" filterable allow-create default-first-option>

      <el-option-group v-for="gp in cities" :key="gp.key" :label="gp.key">
        <el-option v-for="item in gp.value" :key="item" :label="item" ></el-option>
      </el-option-group>
    </el-select>

   </div>

</template>

<script>
  export default {
    data () {
      return {
        selectvalue: [],
        options: [{key: "one",value: "牛奶"},
                  {key:"two",value:"蛋糕"},
                  {key:"three",value:"香蕉"},
                  {key:"four",value:"苹果"}],
        newvalues: [],

        cities: [
          { key: "one", value: ["北京","上海","广州"]},
        ]
      };
    }
  }
</script>

<style>

</style>