远程搜索输入框

<template>
  <div>
    <el-autocomplete
      :fetch-suggestions="querySearchAsync"
      placeholder="邮箱/姓名/职业/部门"
      @select="change_week_user"
      style="width: 250px"
      suffix-icon="el-icon-search"
      v-model="search_value"
    ></el-autocomplete>
  </div>
</template>
<script>
  import axios from 'axios'

  export default {
    data() {
      return {
        search_value: ''
      }
    },
    methods: {
      change_week_user(item) {
        this.weekUserName = item.name
        this.weekUserId = item.id
        this.get_week() // 处理选择的这个item
      },
      querySearchAsync(queryString, cb) {
        var list = [{}];
        //调用的后台接口
        var userId = this.$store.state.userId
        var token = this.$store.state.token
        axios.get(Glob.PORT + '/week_search_list?name=' + queryString, {
          headers: {
            'id': userId,
            "token": token
          }
        }).then(
          (response) => {
            for (let i of response.data.result) {
              i.value = i.name;  //将想要展示的数据作为value
            }
            list = response.data.result
            cb(list)
          }
        )
      },
    }
  }
</script>

• 功能：调用querySearchAsync方法向后端请求数据显示在输入框下面作为提示。点击提示内容后触发@select事件，调用change_week_user方法来处理选择对象。对象的value值是显示的提示内容，没有的话要定义。