SOURCE

console 命令行工具 X clear

                    
>
console
var Main = {
    data() {
      return {
          tags: [],
        options: [],
        value: [],
        list: [],
        loading: false,
        states: ["Alabama", "Alaska", "Arizona",
        "Arkansas", "California", "Colorado",
        "Connecticut", "Delaware", "Florida",
        "Georgia", "Hawaii", "Idaho", "Illinois",
        "Indiana", "Iowa", "Kansas", "Kentucky",
        "Louisiana", "Maine", "Maryland",
        "Massachusetts", "Michigan", "Minnesota",
        "Mississippi", "Missouri", "Montana",
        "Nebraska", "Nevada", "New Hampshire",
        "New Jersey", "New Mexico", "New York",
        "North Carolina", "North Dakota", "Ohio",
        "Oklahoma", "Oregon", "Pennsylvania",
        "Rhode Island", "South Carolina",
        "South Dakota", "Tennessee", "Texas",
        "Utah", "Vermont", "Virginia",
        "Washington", "West Virginia", "Wisconsin",
        "Wyoming"]
      }
    },
    mounted() {
      this.list = this.states.map((item, i) => {
        return { value: i, label: item+1 };
      });
    },
    methods: {
      remoteMethod(query) {
          console.log('aaaa:', query);
        if (query !== '') {
          this.loading = true;
          setTimeout(() => {
            this.loading = false;
            this.options = this.list.filter(item => {
              return item.label.toLowerCase()
                .indexOf(query.toLowerCase()) > -1;
            });
          }, 3000);
        } else {
          this.options = [];
        }
      },
      handleChange(a) {
          console.log('bbbb:', a);
          this.tags.push(a);

          this.value = [];
      }
    }
  }
var Ctor = Vue.extend(Main)
new Ctor().$mount('#app')
<script src="//unpkg.com/vue/dist/vue.js"></script>
<script src="//unpkg.com/element-ui@2.12.0/lib/index.js"></script>
<div id="app">
<template>
  <el-select
    v-model="value"
    filterable
    allow-create
    collapse-tags="true"
    remote
    
    placeholder="请输入关键词"
    :remote-method="remoteMethod"
    @change="handleChange"
    :loading="loading">
    <el-option
      v-for="item in options"
      :key="item.value"
      :label="item.label"
      :value="item.value">
    </el-option>
  </el-select>

  <el-tag
    v-for="tag in tags"
    :key="tag"
    closable>
    {{tag}}
    </el-tag>
</template>
</div>
@import url("//unpkg.com/element-ui@2.12.0/lib/theme-chalk/index.css");