element-plus 自动搜索 el-autocomplete，异步请求不显示结果

element-plus 自动搜索 el-autocomplete，异步请求不显示结果

代码

<el-autocomplete style="width: 58%;"
				  v-model="ruleFrom.spaceName"
				  value-key="spaceName"
				  :fetch-suggestions="querySearch"
				  :trigger-on-focus="false"
				  placeholder="请输入内容"
				  clearable
				></el-autocomplete>

• 问题描述：querySearch是异步请求接口，接口有返回数据，但是没有显示出来
  解决方法

方案一

• value-key绑定需要显示出来的值。需要显示哪个字段，就绑定哪个字段！！！
• 接口返回字段必须要与绑定字段一致

方案二

• 不写value-key，利用search中cb(data)，data需要包含value字段。如下：

querySearch(querystring, cb){
    setTimeout(()=>{
    //请求接口返回的数据
	   const data = [{ "value": "vue" }]
	    callback(data)
    }, 1000)

// 如果请求返回的数据没有value，需要自己重构下数据。
          

      ## 所有代码
<template>
		 <el-autocomplete
                  style="width: 100%"
                  v-model="planForm.ownerRoleName"
                  value-key="name"
                  :fetch-suggestions="querySearchAsync"
                  :trigger-on-focus="false"
                  placeholder="请输入内容"
                  clearable
                />
                </template>
			<script>
		const querySearchAsync = (queryString: string, cb: (arg: any) => void) => {
			  if (timeout) clearTimeout(timeout)
 				 timeout = setTimeout(async () => {
   				 let res = await getdeptApi(queryString)
    			cb(res)
  			}, 500)
		}
		</script>