el-autocomplete后台返回自定义字段展示

 <el-autocomplete
          v-model="form.name"
          :fetch-suggestions="querySearch"
          clearable
          class="inline-input w-50"
          placeholder="Please Input"
          @select="handleSelect"
          style="width: 220px"
        >
          <template #default="{ item }">
            <div class="value">{{ item.name }}</div>
          </template>
        </el-autocomplete>

　　

interface LineBody {
  id: string
  name: string
}
const lineBodys = ref<LineBody[]>([])
const querySearch = (queryString: string, cb: any) => {
  const results = queryString ? lineBodys.value.filter(createFilter(queryString)) : lineBodys.value
  // call callback function to return suggestions
  cb(results)
}
const createFilter = (queryString: string) => {
  return (lineBody) => {
    //return lineBody.name.toLowerCase().indexOf(queryString.toLowerCase()) === 0
    return lineBody.name.toLowerCase().indexOf(queryString.toLowerCase()) >= 0
  }
}
const loadAll = async () => {
  const results = await getLineBodys()

  return results.items
}

const handleSelect = (item: LineBody) => {
  form.value.name = item.name
}

onMounted(async () => {
  lineBodys.value = await loadAll()
})