el-autocomplete自动补全代码，如何回显接口查询返回的列表，并取出数组中的指定值展示

您可以使用el-autocomplete组件来实现自动补全功能，并在接口查询返回的列表中展示结果。以下是一个示例代码：

<template>
  <el-autocomplete
    v-model="inputValue"
    :fetch-suggestions="querySearch"
    @select="handleSelect"
    placeholder="请输入关键字"
  >
    <template slot-scope="{ item }">
      {{ item.value }}
    </template>
  </el-autocomplete>
</template>

<script>
export default {
  data() {
    return {
      inputValue: '',
      suggestions: [] // 接口查询返回的列表
    };
  },
  methods: {
    querySearch(queryString, callback) {
      // 调用接口查询数据并返回结果
      // 这里假设接口返回的数据格式为 { value: 'xxx', ... }
      // 将接口返回的列表赋值给 suggestions
      this.suggestions = [
        { value: 'Apple', id: 1 },
        { value: 'Banana', id: 2 },
        { value: 'Orange', id: 3 }
      ];

      // 过滤出包含输入关键字的结果并返回
      const results = queryString
        ? this.suggestions.filter(item =>
            item.value.toLowerCase().includes(queryString.toLowerCase())
          )
        : this.suggestions;

      callback(results);
    },
    handleSelect(item) {
      // 在这里可以获取到选中项的值，并进行相应的操作
      console.log(item);
      // 取出数组中的指定值展示
      console.log(item.id);
    }
  }
};
</script>

在上述代码中，我们使用了`el-autocomplete`组件来实现自动补全功能。通过`fetch-suggestions`属性指定了查询方法`querySearch`，该方法会在输入框中输入内容时被触发。在`querySearch`方法中，您可以调用接口查询数据，并将返回的结果赋值给`suggestions`数组。然后，根据输入关键字过滤`suggestions`数组，将过滤后的结果返回给自动补全组件。

当用户选择某个选项时，会触发`handleSelect`方法，并将选中项的值作为参数传入。在`handleSelect`方法中，您可以获取到选中项的值，并进行相应的操作，例如取出数组中的指定值进行展示。

请根据您的实际情况修改上述代码，其中的接口查询和数据处理部分需要根据您的业务逻辑进行调整。希望对您有所帮助！