<!-- 添加或修改信息的对话框 -->

<el-form-item label="客户名称"  prop="customerName">
          <el-autocomplete popper-class="my-autocomplete"
                           v-model="form.customerName"
                           :fetch-suggestions="querySearch"
                           placeholder="请客户名称"
                           :disabled="IsDisabled"
                           @select="((item)=>companyList(item))">
            <template slot-scope="{ item }">
              <div class="name">{{ item.value }}</div>
            </template>
          </el-autocomplete>
</el-form-item>

参数解释：

        companyList ： 自己定义的集合用来装后端查询的数据

在  data(){} 里定义  companyList: [],

在方法中 写入

querySearch(queryString, cb) {
      let that = this;
      var solList = []
      that.companyList.forEach(item => {
        //  这里指我们要展现的值 对应上文 {{ item.value }}
        solList.push({ 'label': item.id, 'value': item.customerUnitName })
      })

      var results = queryString
        ? solList.filter(this.createFilter(queryString))
        : solList;
        cb(results);
    },
    createFilter(queryString) {
      let that = this;
      var solList = that.companyList;
      return solList => {
        return (
          //solList.label.toLowerCase().indexOf(queryString.toLowerCase()) === 0
          solList.label
        );
      };
    },
    handleSelectMethod(item) {
      console.log(item);
    },

定义一个获取后台数据方法

getintment() {
      getintmentInfo().then(data => {
        if (data.code === 200) {
          this.companyList = data.data
        } else {
          this.$message.error(data.msg);
        }
      })
    }

在VUE的钩子方法中，页面一加载就方法执行，将数据装定义好的集合中

mounted() {
    this.handleSelectMethod()
    this.companyList = this.appointment()
}